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


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 »

On a number of a occassions I've run into the following ASP.NET / IIS7 error after uploading my newly built Visual Studio.net web project site into IIS (where the site had previously been working fine): 'Timeout expired. The timeout period elapsed prior...  more »

MySQL has several ways to create backups of important data. In this article, I will show you how to create a backup of your MySQL database on a Windows machine using the MYSQLDUMP utility that is included with MySQL.  more »

I just installed the URL Rewrite Module for IIS 7.0 and started playing around with how to setup rules to create search engine friendly URLs. The first rule I decided to setup was to redirect a site to the WWW sub-domain version when it was not typed in...  more »

Here's how you can quickly pair your Apple AirPods with your Windows PC.  more »

By default, the Quick Launch bar is not enabled on the Taskbar in Windows 7, as it was in Vista and XP. Instead, you're able to drag and pin programs to the Taskbar in Windows 7 for quick access to programs. However, if you want to bring back the Quick...  more »

If you like having the Printers selection button on the Vista Start menu, you can easily add it to the menu. Follow these steps to add the Printers button to the Vista Start menu: Right click on an empty area on the Taskbar and then select Properties....  more »

After installing Windows 7 (or Windows Vista) you may want to check to see if the software was actually activated. Follow these steps to determine whether your copy of Windows has been activated successfully: Go to 'Control Panel'. Click on 'System and...  more »

Running ipconfig directly in Windows 7 may cause you to experience the ipconfig box to pop-up and run for a split second and the screen to flash, but then go away. The reason for this is probably because you are running ipconfig directly from the Windows...  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 »

You may need to have an image refreshed automatically on a web page in ASP.NET to get the latest image. One instance where you might want the fresh image is if you upload an image that has the same file name as an already existing image file on the...  more »

There may be a time when you want to get a larger detailed view of a photo on Instagram. Unfortunately, Instragram currently doesn't have a feature to enlarge or magnify photos within the Instagram iphone app. However, with a little change to your iPhone...  more »