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 upgraded to Windows 7 Home Premium on my Dell Inspiron laptop. After using the laptop for a few days, I noticed that the screen display brightness was much dimmer than what it had been when Windows Vista was installed on the laptop. To solve my...  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 »

When developing websites or applications in Visual Studio.NET, you sometimes need to have Visual Studio run as an administrator. For instance, if you are developing a Web Application Project that uses IIS7 as the local development server for testing,...  more »

Use a Laptop Cooler Cooling Pad to keep Laptop from Overheating in Hot Summer Temperatures  more »

Here's a quick tip on how you can adjust the mouse pointer speed in Windows 7: Click Start menu, and then open Control Panel. Then click on Hardware and Sound. Now under Devices and Printers, click on Mouse. The Mouse Properties box should pop-up, click...  more »

OpenOffice Calc lets users import data from various other systems. It is able to open up files of many other applications and convert them. A. You can check what types of files OpenOffice Calc is able to convert in the File > Open menu. Go to the File...  more »

ISO files contain the image of a disc, which is essentially an exact copy of the low level data actually stored on a disc. Typically, ISO image files have a file extension of .iso. When burning an ISO file to CD or DVD, you'll want to just make sure that...  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 »

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 »

Zipping a file or folder up can be a great way to compress the file in order to make the file size smaller and easier to manage. It can be especially useful when you want to send a large file to someone via email, since most email hosts limit the file...  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 »

Taking the cover off of a Dell XPS 8000 computer can be a bit of a mystery if you have never removed it before. Here's how to open the case of a Dell XPS 8000 for the first time: At the back of the Dell XPS 8000 case, remove the screw just below the hand...  more »