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


Setting up Gmail on your Apple device can involve a few steps. Here's how to get Gmail setup on an iPhone that uses Apple's Mail app: 1.) Tap the "Settings" app on your iPhone. Then select "Calendar, Contacts and Mail" from the populated list. 2.) Tap on...  more »

At some point you may need or want to test your computers memory ram to make sure it is work correctly. In Windows 7, you can easily test your memory or RAM using the built in Windows Memory Diagnostic Tool. To do this in Windows 7 follow these steps: In...  more »

SQL Server Reporting Services can be a pain in the arse to set up correctly for the first time. Even after you've got things running correctly, you can sometimes run into issues, which is exactly what happened to me recently. I had setup my local...  more »

A regular expression for validating a image url.  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 »

I just came across a way to test a data providers connection string (like a SQL Server database) with the help of a plain text file using Notepad. To investigate and test out if your connection string works, your going to want to create a UDL file. To do...  more »

So yesterday I downloaded the new version of iTunes 9, and updated my iPhone with OS version 3.1. Everything seemed to be working great until I went to play my podcast playlists on my iPhone. The podcast playlists were not syncing to my iPhone for some...  more »

There may be a time when you want to get a larger detailed view of a photo on Instagram. Unfortunately, Instragram currently doesn't have a feature to enlarge or magnify photos within the Instagram iphone app. However, with a little change to your iPhone...  more »

To display line numbers in a Visual Studio.net 2008 code window do the following: Open Visual Studio.net On the Menu bar, Select 'Tools' -> 'Options' In the Options pop-up window, Select 'Text Editor' -> 'All Languages' > 'General'. Note: If you...  more »

Do you know that your used printer inkjet and toner cartridges can be recycled? Yes, you can definitely use them again. You can even earn money from them after they've run out of ink. Below are the steps on how you can do just that. 1.) Go to OfficeMax,...  more »

You may need to have an image refreshed automatically on a web page in ASP.NET to get the latest image. One instance where you might want the fresh image is if you upload an image that has the same file name as an already existing image file on the...  more »

If you want to have two seperate Microsoft Excel files open that are separate from each other, that don't load within the same instance of Excel, then keeping reading to find out how to get around this limitation.  more »