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


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 »

Do you know that your used printer inkjet and toner cartridges can be recycled? Yes, you can definitely use them again. You can even earn money from them after they've run out of ink. Below are the steps on how you can do just that. 1.) Go to OfficeMax,...  more »

Here's how you can do a simple validation check for blank spaces in javascript. In the example below, the javascript function first trims the text value to make sure there is no extra white space and then checks the length for 0: function...  more »

If you ever wanted to change a field to null in a Sql Server 2005 Management Studio result set, you're in luck because there is a quick and easy way to do it.  more »

Below are the steps to update the firmware on a Linksys E4200 Router. Before getting started make sure you download the latest firmware version to your computer from the Linksys site, go to http://support.linksys.com/en-us/support/routers/E4200 and click...  more »

Windows operating systems (such as Windows Vista), every file extention is associated with a default program. When you open a file, the program that is associated to the file extension will open the file by default. However, you can change or set the...  more »

Today I got a new laptop battery for my Dell Inspiron laptop. The old battery that came with the laptop was completely dead, so I wanted to find out if there was an easy way to recycle the old battery instead of throwing it way. Ever since watching...  more »

OpenOffice Calc lets users import data from various other systems. It is able to open up files of many other applications and convert them. A. You can check what types of files OpenOffice Calc is able to convert in the File > Open menu. Go to the File...  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 »

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 »

Here's tips on how to quickly delete rows or columns from an Excel Worksheet.  more »

If you've recently moved a Visual Studio.net web site project (wsp) or web application project(wap) to deploy on Internet Information Services 7 (IIS7) you may have discovered that your Tiny_MCE text editor no longer is showing up and getting the pop-up...  more »