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


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 »

Turn on Automatic Updates in Windows XP so that new security updates from Microsoft will be automatically downloaded and installed on your computer. By enabling Automatic Updates you will help make your computer safer from internet security threats and viruses.  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 »

If you're making the jump to begin using the Windows Live Mail email client now in Windows 7, from the Windows Mail client that was on Windows Vista, you may want to transfer over your previously entered email account setup details that you had been using...  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 »

How to implement a StopWords filter in C# that will filter out certain woulds from a query.  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 »

I recently discovered an issue after I upgraded to TinyMCE 4.1.3 version text editor in my ASP.NET web pages that was causing the formatting of my <pre> tags to not keep its line break formating on PostBack. At first I thought this might be a CSS...  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 »

The Windows Live Messenger sign box will by popup by default on computer startup. This can be quite annoying especially if you don't even use the Windows Live instant messenger client. Luckily, you can easily turn off the Windows Live Messenger popup box...  more »

If you've ever wanted to get Related Posts based on similar Tags from other Posts using SQL, the following SQL code should help with creating your own SQL query. In this example, the Related Posts are articles, but they could be Blog posts or any other...  more »

Learn how to add two or more cells together in Microsoft Excel.  more »