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


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 »

Learn how to make back up copies of your favorite DVDs with the freeware utility called DVD Shrink. You'll be able to back up your copy protected DVD movies to your hard drive, or burn them to disc.  more »

When using SQL Server 2008, you may receive a Save (Not Permitted Dialog) box pop-up when trying to save changes to an existing table. The dailog box reads: "Saving changes is not permitted. The changes you have made require the following tables to be...  more »

To create a border outline for a transparent rectangle or circle in Photoshop do the following: Select the "Rectangle Marquee Tool" (or use the "Circle Marquee Tool" for drawing an oval) and then draw an outline for the border area. Go to the "Edit" menu...  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 »

This tutorial goes through the steps of how to import a SQL script file into a MySQL database.  more »

Learn how to get the latest security updates and service packs for your Microsoft Windows computer.  more »

If you want to have two seperate Microsoft Excel files open that are separate from each other, that don't load within the same instance of Excel, then keeping reading to find out how to get around this limitation.  more »

GodMode is a hidden system control panel in Windows 7 that lets you access all the operating system's control panels from within a single folder without the need to browse options and folders in the Control Panel. To access "GodMode" follow these steps:...  more »

Here's how you can find the text of a particular TextBox witnin an ASP.NET GridView row and then Select and Copy the text to Clipboard with Javascript. First put the following javascript in the HTML of your page (either in HEAD of your html page or...  more »

Here's how to install Internet Information Services (IIS7) on a Windows 7 (or Vista) computer so that ASP.NET websites will run on the IIS7 web server. First, you will want to make sure that you are signed into an account with Administrator access on your...  more »

While using my new Windows 7 64-bit computer, with Visual Studio 2010 running as Administrator, I began getting the following error while trying to open up individual c# files or asp.net files in VS2010: "There was a problem sending the command to the...  more »