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


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 »

Finding Cookies in Windows Vista is a little trickier than you might think. Most cookies are found in the following folder location: C:\Users\<user>\AppData\Roaming\Microsoft\Windows\Cookies\Low So you can just type that into the windows address bar...  more »

When using SQL Server 2008, you may receive a Save (Not Permitted Dialog) box pop-up when trying to save changes to an existing table. The dailog box reads: "Saving changes is not permitted. The changes you have made require the following tables to be...  more »

While using my new Windows 7 64-bit computer, with Visual Studio 2010 running as Administrator, I began getting the following error while trying to open up individual c# files or asp.net files in VS2010: "There was a problem sending the command to the...  more »

If you recently bought a new Dell Laptop with Windows 10, you may be wondering why the headphone input jack is not working correctly when you plug in speakers or headphones (or possibly a mic). Well, unlike older Dell laptops that may have had two input...  more »

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 »

In this tutorial you will learn how to backup the Registry on a Windows computer. Having a backup of your registry is extremely important if you plan to make any manual settings changes to the Registry, because if you make a mistake while messing around...  more »

Here's how to install Internet Information Services (IIS7) on a Windows 7 (or Vista) computer so that ASP.NET websites will run on the IIS7 web server. First, you will want to make sure that you are signed into an account with Administrator access on your...  more »

Here's how you can add "nofollow" tags to links generated by a Sitemap file that is bound to an ASP.NET Repeater control using a SiteMapDataSource. I'm currently using this technique for the footer links of GotKnowHow.com, so if you View Source of the...  more »

Prevent QuickTime from loading in your startup menu when Windows boots up.  more »

Windows operating systems (such as Windows Vista), every file extention is associated with a default program. When you open a file, the program that is associated to the file extension will open the file by default. However, you can change or set the...  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 »