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


Learn how to manually initiate the transferring of pictures to your computer with Kodak's EasyShare software.  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 »

There may be a time when you want to use special characters in a Word document or other text file. With Windows Vista and Windows 7 you can quickly bring up a Character Map, which allows you to copy special characters or symbols, which can then be pasted...  more »

To create a border outline for a transparent rectangle or circle in Photoshop do the following: Select the "Rectangle Marquee Tool" (or use the "Circle Marquee Tool" for drawing an oval) and then draw an outline for the border area. Go to the "Edit" menu...  more »

ISO files contain the image of a disc, which is essentially an exact copy of the low level data actually stored on a disc. Typically, ISO image files have a file extension of .iso. When burning an ISO file to CD or DVD, you'll want to just make sure that...  more »

The AjaxFileUpload control that's part of the AJAX Control Toolkit, works great for easily uploading multiple files at once. However, it gets a little tricky if you want to update an UpdatePanel after all the files have finished uploading, especially if...  more »

This step-by-step goes through the process of importing delimited text files into a SQL Server 2005 database. The example should help you better understand how to import different types of flat files into SQL Server 2005.  more »

The Windows Live Messenger sign box will by popup by default on computer startup. This can be quite annoying especially if you don't even use the Windows Live instant messenger client. Luckily, you can easily turn off the Windows Live Messenger popup box...  more »

I recently discovered an issue after I upgraded to TinyMCE 4.1.3 version text editor in my ASP.NET web pages that was causing the formatting of my <pre> tags to not keep its line break formating on PostBack. At first I thought this might be a CSS...  more »

After running a ASP.NET website on IIS 7.5 for the first time on a Windows 7 computer, I was faced with the following error message: Login failed for user 'IIS APPPOOL\ASP.NET v4.0'. Description: An unhandled exception occurred during the execution of the...  more »

A regular expression for validating a image url.  more »

Here's how you can determine if your computer is running a 32-bit or 64-bit version of Windows: Click on the Start button -> then click Control Panel, -> then click System and Maintenance, -> and then click System. In the System section, you'll...  more »