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


Windows Vista comes with a little known tool called the "Snipping Tool" that allows you to take screenshots of your computer screen. The Snipping Tool has the ability to take 4 different types of screenshots. You can choose from Free-form Snip,...  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 »

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 »

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 »

To create a border outline for a transparent rectangle or circle in Photoshop do the following: Select the "Rectangle Marquee Tool" (or use the "Circle Marquee Tool" for drawing an oval) and then draw an outline for the border area. Go to the "Edit" menu...  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 »

Early today, I received an email from my Grandma who will turn 90 years old in just a few months asking me the following question: "How do I delete two or three files at one time?" In order to answer this somewhat complicated process and make it...  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 »

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 »

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

If you’ve experienced as many problems as I have while trying to Import/Export my Sql Server 2005 database to a hosting provider for the first time, then hopefully this how-to will be of some assistance to you.  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 »