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


When a Windows XP, Vista, or Windows 7 program locks up and says "Not Responding" it can be quite annonying having it to wait for the program to snap out its non-responding state. Sometimes you don't want to wait a few minutes to have the program come...  more »

Here's a step by step process to enable a remote connection to your SQL Server 2008 Express database that is configured on Windows Server 2008 using an assigned port #. 1) First make sure the SQL Server Authentication is enabled and the User name that...  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 »

A regular expression for validating a image url.  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 »

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 »

This virus has been hitting systems for years, and has been resurging lately. Two computers in my household were infected within the same week, by different web sites. The virus may be getting around by an infected advertisement. Web owners accept the ad,...  more »

I just installed the latest version on AOL's Instant Messenger (AIM) version 7.3. The first time after rebooting my computer, I was instantly hit with AIM starting up as well as the AIM Welcome Page popping-up much to my surprise. To say the least, this...  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 »

Have you ever deleted an old podcast episode in iTunes and then wanted to re-download it? To get deleted podcast episodes to show up again in iTunes you could just delete your subscription to the particular podcast, and then resubscribe to the podcast for...  more »

Here's one way to setup your connection string for a SQL Server 2008 Express database for a live website using ASP.NET on Windows Server 2008. Open "Sql Server Configuration Manager" -> the click on "SQL Server Network Configuration" -> then click...  more »

Email messages sometimes are sent with images attached, which make saving the images to your computer fairly easy. However, sometimes the pictures are only embedded within the actual email message without the ability to download any attachments. This can...  more »