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


Today I ran into the a "Restore failed for Server" error message while trying to restore a SQL Server 2008 database using a database backup (.bak) file. Below I will show you how to fix this restore error, so that you can restore your SQL Server database...  more »

Have you ever deleted an old podcast episode in iTunes and then wanted to re-download it? To get deleted podcast episodes to show up again in iTunes you could just delete your subscription to the particular podcast, and then resubscribe to the podcast for...  more »

The default settings in Visual Studio 2010 Professional do not automatically show the Solution file by default in the Solution Explorer sidebar. This can be a bit of a problem if you are trying to add another project to your existing solution. To get the...  more »

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

I just came across a way to test a data providers connection string (like a SQL Server database) with the help of a plain text file using Notepad. To investigate and test out if your connection string works, your going to want to create a UDL file. To do...  more »

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

MySQL has several ways to create backups of important data. In this article, I will show you how to create a backup of your MySQL database on a Windows machine using the MYSQLDUMP utility that is included with MySQL.  more »

So you just got a new computer... now it's time to get your entire iTunes library of music, podcasts, playlists, apps, and purchased files from your old computer to your new computer. The following step-by-step will show you how you can move all of your...  more »

SQL Server Reporting Services can be a pain in the arse to set up correctly for the first time. Even after you've got things running correctly, you can sometimes run into issues, which is exactly what happened to me recently. I had setup my local...  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 »

For a while I wasn't sure how to access GetRouteUrl from an .ashx IHttpHandler page. I wanted to access route url's setup in the Global.asax file to be used in files like rss.ashx, instead of having to hard codes the page URL's in my .ashx pages. Well,...  more »

In Windows 7, the Recycle Bin seems to be missing from the desktop by default. Fortunately, it's pretty simple to show (or hide) the Recycle Bin on the desktop. To show (or hide) the Recycle Bin on the desktop in Windows 7 follow these steps: Click the...  more »