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


When developing websites or applications in Visual Studio.NET, you sometimes need to have Visual Studio run as an administrator. For instance, if you are developing a Web Application Project that uses IIS7 as the local development server for testing,...  more »

This tutorial will teach you how to use the SUM function in Microsoft Excel to add column values together in order to calculate a total amount.  more »

No longer getting any sound from your computer? Well the fix for this could be as simple as un-muting the volume control in Windows. I've mistakenly muted the speakers on my laptop many times, due to accidently hitting the volume mute button on the front...  more »

Not sure what to do with your old Dell computer equipment? If you have Dell computer equipment lying around that no longer works or you don't use, why not recycle it for free at Staples. Here's the details on how to recycle Dell computer equipment at...  more »

Finding Cookies in Windows Vista is a little trickier than you might think. Most cookies are found in the following folder location: C:\Users\<user>\AppData\Roaming\Microsoft\Windows\Cookies\Low So you can just type that into the windows address bar...  more »

After installing Windows 7 (or Windows Vista) you may want to check to see if the software was actually activated. Follow these steps to determine whether your copy of Windows has been activated successfully: Go to 'Control Panel'. Click on 'System and...  more »

Here are two step by step examples showing you how to move a window that is off screen using the arrow keys on your keyboard.  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 »

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

The new Routing features in ASP.NET 4.0 are pretty awesome. However, one issue I ran into recently was trying to get the fully qualified urls from Page.GetRouteUrl as string urls to be used in emails messages. Unfortunately, I wanted something that worked...  more »

So if you're like me, you may be happy with Windows 7 (or 8.1) on your current computer or laptop, and have no interest in upgrading to Windows 10. But you may also be getting bombarded by Microsoft to upgrade to Windows 10, with the Windows 10 upgrade...  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 »