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 get the latest security updates and service packs for your Microsoft Windows computer.  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 »

Subscribing to a Podcast using iTunes can be accomplished in a couple of different ways. One of the simplest ways is to open iTunes and go to the iTunes Store. From there you can either search for your favorite podcasts using the search box or find...  more »

Are you having trouble installing the Google Adwords Editor on Windows Vista? I was getting a pop-up 'Error 2739' every time I went to install it on my Vista machine. Here's a the solution that worked for me, which allowed me to successfully install Google Adwords Editor on my computer.  more »

For the longest time, I've had a problem of not being able to see all the folders in my Pictures folder when using the Browse button on websites to upload a picture (or file) in Internet Explorer 11 (or in IE10). For whatever reason, some of the folders...  more »

This computer tip will help you quickly increase or decrease the size of text on a web page or in an email message for better viewing using a mouse click wheel.  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 »

If you like having the Printers selection button on the Vista Start menu, you can easily add it to the menu. Follow these steps to add the Printers button to the Vista Start menu: Right click on an empty area on the Taskbar and then select Properties....  more »

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 »

I recently installed SQL Server 2008 database on my local computer and forgot to enable the common language runtime (CLR). Because I had forgotten to turn it on, some portions of my sites were not fuctioning properly due SQL Server not being able to...  more »

So after using Google Chrome for the first time in a while, it seemed to automatically make itself the default web browser on my computer. Unfortunately, I didn't want this, and after clicking on a hyperlink in an email, it began automatically opening...  more »

Here's how you can UrlEncode the plus sign (+) in a URL querystring in ASP.NET and then retrieve the plus symbol after UrlDecoding the string. In this example, I will do a postback and redirect the Server.UrlEncoded string to another page. First we will...  more »