How to Wrap Text in an Html PRE tag

A CSS technique for Wrapping Preformated text in the PRE tag.
by

To force long text lines to wrap in an HTML <pre> tag, you can use CSS code to wrap the text. The word-wrapping CSS code below should work to wrap long lines of text within the <pre> tag, in IE, Firefox and Safari...   you may want to test the browsers for yourself just to make sure though.

With that said, simply add the following snipet of CSS code to your main CSS file:

pre
{
    overflow-x: auto; /* Use horizontal scroller if needed; for Firefox 2, not needed in Firefox 3 */
    white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */ /* width: 99%; */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
}
 


0
0

Add your comment

by Anonymous - Already have an account? Login now!
Your Name:

Comment:
Enter the text you see in the image below
What do you see?
Can't read the image? View a new one.
Your comment will appear after being approved.

Related Posts


The following is a step-by-step example of how you can easily import delimited text files into Microsoft Excel. You can use the Excel Text Import Wizard to quickly import files delimited by Tab, Semicolon, Comma (also known as Comma Separated Value (CSV) file format), Space or Other (you choose), or divided by fixed width columns.  more »

Learn how to manually initiate the transferring of pictures to your computer with Kodak's EasyShare software.  more »

If you only have one monitor, but want to split your screen to work in two different windows at the same time, you can now easily do that with Windows 7. The new split screen feature in Windows 7 allows you to view 2 windows side by side on your screen...  more »

So you just got a new computer... now it's time to get your entire iTunes library of music, podcasts, playlists, apps, and purchased files from your old computer to your new computer. The following step-by-step will show you how you can move all of your...  more »

Below are the steps to update the firmware on a Linksys E4200 Router. Before getting started make sure you download the latest firmware version to your computer from the Linksys site, go to http://support.linksys.com/en-us/support/routers/E4200 and click...  more »

In SQL Server 2008 Management Studio, you may want to change the default settings to allow you to edit more than the 200 rows at a time, or select more than 1000 rows, which are the default settings for SQL Server. To modify "Edit Top 200 Rows" or "Select...  more »

Here's a tip on how to create a Regular Expression to validate a positive number that can optionally have a decimal with decimal places. The Regular Expression will also be valid if there are any whitespace before or after the number. I'm using this Regex...  more »

Copying text from the command prompt is pretty easy, but it's not all that straightforward if you've never done it before. Knowing how to copy text from the command prompt can come in handy, especially if you need to show someone else (like a forum user)...  more »

I just installed the latest version on AOL's Instant Messenger (AIM) version 7.3. The first time after rebooting my computer, I was instantly hit with AIM starting up as well as the AIM Welcome Page popping-up much to my surprise. To say the least, this...  more »

Here's a quick way to enable programs to 'Run as Administrator' in Windows Vista. Click on the 'Start' menu button, it's the blue circle located on the left-hand side of the Task bar. Now click on 'All Programs' Find the program you want to 'Run as...  more »

This step by step will show you how to scan a picture using Windows‌ Photo Gallery, which should come installed by default on Windows Vista and Windows 7 operating systems. Once pictures are scanned using Windows Photo Gallery, your pictures are...  more »

If you're making the jump to begin using the Windows Live Mail email client now in Windows 7, from the Windows Mail client that was on Windows Vista, you may want to transfer over your previously entered email account setup details that you had been using...  more »