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


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 »

Learn how to add two or more cells together in Microsoft Excel.  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 »

Excel makes it easy to capitalize the first letter of every word in a cell. To capitalize each word you simply need to use the formula =PROPER(). For instance, if you have data in the cell A1, then you would want to enter the following formula in cell B1:...  more »

In the code below, you will be able to find the baseUrl of your website using javascript. The following javascript code will work when used on your localhost or when it's used in a live site (finds the root url of the domain address). Just add this...  more »

Here's how you can quickly remove multiple Blank cells in Excel: 1) Select the area of cells or columns you want to have blank cell spaces removed. 2) Then press "Ctrl" + "G" on your keyboard.. this will pop-up the Go To box. 3) Now press "Alt" + "S" on...  more »

There are a number of online websites that allow you to check the speed of your broadband connection. They are useful, especially when you need to check your internet connection to determine if it's slow and to be able to benchmark it versus other...  more »

The default settings in Visual Studio 2010 Professional do not automatically show the Solution file by default in the Solution Explorer sidebar. This can be a bit of a problem if you are trying to add another project to your existing solution. To get the...  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 »

So below I'm going to share with you a fairly easy to use and understand ASP.NET User Control that allows you to pick a Date (with the ajaxToolkit CalenderExtender) and also select the Time of day using a drop down list. I've named the control...  more »

Ever since moving to a Windows 7 (64 bit) computer, I haven't been able to view Photoshop thumbnail previews of .psd files in Windows Explorer. However, today I decided to find a solution to this anonying problem, so that I could start seeing previews of...  more »

Late last week my Windows 7 (64-bit) computer started experiencing random freezes with the screen getting pixelated just before locking up. I would have to do a manual restart, to get the computer up and running. It started happening just a day after...  more »