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


I recently moved my sites over to a new web server that has "Windows Server 2008 R2" installed. The older server had just been running "Windows Server 2008". After moving my sites over I discovered that my AJAX Toolkit AutoComplete functionality had...  more »

Today, Microsoft released new FREE Anti-virus and malware protection software called Security Essentials. Microsoft Security Essentials (MSE) is a real-time anti-virus scanner that anyone can download for free and use for personal use. You can use...  more »

There's a good chance that if you're database driven application is running into the following sql error message that says "String or binary data would be truncated", that the error is being caused by an issue in a SQL statement or in the SQL code of a...  more »

By default, the Quick Launch bar is not enabled on the Taskbar in Windows 7, as it was in Vista and XP. Instead, you're able to drag and pin programs to the Taskbar in Windows 7 for quick access to programs. However, if you want to bring back the Quick...  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 »

Email messages sometimes are sent with images attached, which make saving the images to your computer fairly easy. However, sometimes the pictures are only embedded within the actual email message without the ability to download any attachments. This can...  more »

Find out how-to take a snapshot of what’s on your computer screen and turn the screenshot into an image using graphic software. You'll learn how to take a screenshot of your entire computer screen or just a selected window.  more »

Ever since I discovered F.lux for my desktop computer (F.lux helps get rid of of blue screen light at night from your computer monitor), I've been waiting for Apple to enable this functionality on the iPhone screen. Staring into a computer/phone screen...  more »

Just recently, I decided to setup an old computer with a brand new hard-drive to test out Windows 7 Beta, and while setting this up I decided I wanted to connect the computer to my HP Windows Home Server. The only problem was that I could not find the...  more »

It's pretty simple to add more than one clock to your system tray in Windows Vista or 7. Follow these steps to have up to three clocks in different time zones added to the system tray: Open the Control Panel -> then Clock, Language and Region ->...  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 »

Recently, I decided to begin converting my Visual Studio.net Web Site Projects (WSP) to Web Application Projects (WAP) to take advantage of some of the new Web Deployment features in Visual Studio.net 2010 (see Vishal Joshi's blog for a run through of WSP...  more »