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


To change directories while in the windows command prompt use "cd" (cd stands for change directory in DOS)To go to a specific directory type the full path, such as: cd c:\ or cd c:\program files\ To go up one level type: cd ..To see what's in the current...  more »

So yesterday, I started getting green squiggly line validation warnings at design time on ASP.NET server controls within the HTML Design view for my Visual Web Developer 2010 Express project in Windows 7. Essentially, intellisense on all the ASP.NET...  more »

If you've been using Windows Mail on a Windows Vista computer, and upgraded to a Windows 7 computer you may want to copy over your email information from Windows Mail to the newer Windows Live Mail email client on Windows 7. As it stands now Windows Mail...  more »

Early today, I received an email from my Grandma who will turn 90 years old in just a few months asking me the following question: "How do I delete two or three files at one time?" In order to answer this somewhat complicated process and make it...  more »

I recently dealt with an issue of external images not showing in Reporting Services (SSRS) report viewer control within an IIS7 website. When the IIS7 website had it's Application Pool's Managed Pipeline Mode set to "Classic", the external images showed...  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 »

I recently began getting a "Storage Almost Full" message on my 16GB iPhone 5. After deleting most of my photos and videos from my iphone and unsyncing all music, I still had only freed up a few GBs of space. Also in iTunes, it was still showing I had 4...  more »

There's a good chance that if you're database driven application is running into the following sql error message that says "String or binary data would be truncated", that the error is being caused by an issue in a SQL statement or in the SQL code of a...  more »

Today I ran into the a "Restore failed for Server" error message while trying to restore a SQL Server 2008 database using a database backup (.bak) file. Below I will show you how to fix this restore error, so that you can restore your SQL Server database...  more »

UPDATE 12-16-2011: If you are using ASP.NET and your website / database is live, and you want to take the database offline, you're better off putting an App_Offline.htm file in your website main directory to first take the website down for maintance (I...  more »

If you’re running your own dedicated Windows server, then you may need to know how to setup FTP Sites in Windows Server 2003. In this how-to article I will go through the basics of setting up a windows FTP user account, and an FTP Site, which will allow a user to connect to a website using an FTP program.  more »

UPDATE: The better way to do this is to use TinyMCE "rel_list" in the javascript for TinyMCE as seen here. Rather than changing the code in the plugin.min.js file, as shown below (after this update). Also just to note that in TinyMCE version 4.5 they...  more »