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


Here's a step by step process to enable a remote connection to your SQL Server 2008 Express database that is configured on Windows Server 2008 using an assigned port #. 1) First make sure the SQL Server Authentication is enabled and the User name that...  more »

Today I got a new laptop battery for my Dell Inspiron laptop. The old battery that came with the laptop was completely dead, so I wanted to find out if there was an easy way to recycle the old battery instead of throwing it way. Ever since watching...  more »

There may be a time when you want to use special characters in a Word document or other text file. With Windows Vista and Windows 7 you can quickly bring up a Character Map, which allows you to copy special characters or symbols, which can then be pasted...  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 »

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 »

Here's how you can determine if your computer is running a 32-bit or 64-bit version of Windows: Click on the Start button -> then click Control Panel, -> then click System and Maintenance, -> and then click System. In the System section, you'll...  more »

By switching on your iPhone 5's Personal Hotspot feature, you essentailly can turn your iPhone into a WiFi router that other devices can connect to the internet through. You can also establish a password protected network connection which can be shared...  more »

If you only have one monitor, but want to split your screen to work in two different windows at the same time, you can now easily do that with Windows 7. The new split screen feature in Windows 7 allows you to view 2 windows side by side on your screen...  more »

No longer getting any sound from your computer? Well the fix for this could be as simple as un-muting the volume control in Windows. I've mistakenly muted the speakers on my laptop many times, due to accidently hitting the volume mute button on the front...  more »

Recently, I decided to begin converting my Visual Studio.net Web Site Projects (WSP) to Web Application Projects (WAP) to take advantage of some of the new Web Deployment features in Visual Studio.net 2010 (see Vishal Joshi's blog for a run through of WSP...  more »

If you've been using Windows Mail on a Windows Vista computer, and upgraded to a Windows 7 computer you may want to copy over your email information from Windows Mail to the newer Windows Live Mail email client on Windows 7. As it stands now Windows Mail...  more »