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


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

This step-by-step goes through the process of importing delimited text files into a SQL Server 2005 database. The example should help you better understand how to import different types of flat files into SQL Server 2005.  more »

Not sure what to do with your old Dell computer equipment? If you have Dell computer equipment lying around that no longer works or you don't use, why not recycle it for free at Staples. Here's the details on how to recycle Dell computer equipment at...  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 »

Ever since moving to a Windows 7 (64 bit) computer, I haven't been able to view Photoshop thumbnail previews of .psd files in Windows Explorer. However, today I decided to find a solution to this anonying problem, so that I could start seeing previews of...  more »

This article shows the way of converting a movie DVD to Kindle Fire tablet. DVD to Kindle Fire Converter is a professional DVD to Kindle Fire converting tool to help you rip/convert DVD movie to H.264/MPEG-4 video which are compatible with Kindle Fire....  more »

Are you having trouble installing the Google Adwords Editor on Windows Vista? I was getting a pop-up 'Error 2739' every time I went to install it on my Vista machine. Here's a the solution that worked for me, which allowed me to successfully install Google Adwords Editor on my computer.  more »

Are you backing up your SQL Server 2008 databases daily? You should be, especially if you don't want to lose any of your precious data that you're storing. It's incredibly easy to setup a maintenance plan in SQL Server 2008 to automatically back up one or...  more »

Often times when using formula's in Excel, you want to keep just the text values that a formula outputs while deleting the actual formula from the cells. To keep a value in a cell while removing the formula that produced the value try the following: Type...  more »

Here's how you can quickly pair your Apple AirPods with your Windows PC.  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 »

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 »