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


If you are sick of getting the Error Reporting window popping up all the time, then you’ll be happy to know that error reporting can be easily turned off in Windows XP by following these simple steps.  more »

UPDATE: The better way to do this is to use TinyMCE "rel_list" in the javascript for TinyMCE as seen here. Rather than changing the code in the plugin.min.js file, as shown below (after this update). Also just to note that in TinyMCE version 4.5 they...  more »

Here's a cool little tip that I stumbled upon while previewing a photo using Windows Photo Gallery, which allows you to quickly rename the filename of a photo. In this example, I'm using Windows Vista and will be opening JPEG images. Windows Photo Gallery...  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 »

Here's tips on how to quickly delete rows or columns from an Excel Worksheet.  more »

If you do any sort of ASP.NET programming there usually comes a time when you need to get a websites Base URL. The following shows two examples, the first example shows how to get the Base Site Url using C#, which can be used for getting both the...  more »

Today Apple released it's latest operating system, iOS 7.0 for iPhone and iPad devices, along with the newest version of iTunes 11.1. So to get the latest and greatest iOS for your iPhone or iPad here's how you can download and install iOS 7.0. NOTE: Just...  more »

Just recently, I decided to setup an old computer with a brand new hard-drive to test out Windows 7 Beta, and while setting this up I decided I wanted to connect the computer to my HP Windows Home Server. The only problem was that I could not find the...  more »

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

Setting up Gmail on your Apple device can involve a few steps. Here's how to get Gmail setup on an iPhone that uses Apple's Mail app: 1.) Tap the "Settings" app on your iPhone. Then select "Calendar, Contacts and Mail" from the populated list. 2.) Tap on...  more »

The new Routing features in ASP.NET 4.0 are pretty awesome. However, one issue I ran into recently was trying to get the fully qualified urls from Page.GetRouteUrl as string urls to be used in emails messages. Unfortunately, I wanted something that worked...  more »

So my Logitech Wave keyboard was working just fine, then all of a sudden the Space bar key got stuck in the down position. It actually happened while cleaning the keyboard and it's keys (although to be honest, at the time it happened I didn't completely...  more »