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


Often times when using formula's in Excel, you want to keep just the text values that a formula outputs while deleting the actual formula from the cells. To keep a value in a cell while removing the formula that produced the value try the following: Type...  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 »

Here are two step by step examples showing you how to move a window that is off screen using the arrow keys on your keyboard.  more »

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

Find out how to quickly and easily rename a group of files or folders at once.  more »

By default the Quick Launch bar is no longer enabled in Windows 7, which is where the Show Desktop shortcut icon button resided in previous version of Windows. Don't worry, the Show Desktop feature is still included in Windows 7, it's just been redesigned...  more »

Here's how you can find the text of a particular TextBox witnin an ASP.NET GridView row and then Select and Copy the text to Clipboard with Javascript. First put the following javascript in the HTML of your page (either in HEAD of your html page or...  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 »

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 »

After setting up a new Windows 7 computer with IIS 7.5 and Visual Studio 2010, I tried to start my ASP.NET 4.0 website using the Local IIS web server. However, right off the bat I was hit with the following IIS error message: HTTP Error 500.21 - Internal...  more »

This step by step will show you how to scan a picture using Windows‌ Photo Gallery, which should come installed by default on Windows Vista and Windows 7 operating systems. Once pictures are scanned using Windows Photo Gallery, your pictures are...  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 »