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


What is Impress? Impress is a presentation software that is delivered with the free OpenOffice suite of programs. It can be downloaded free of charge, and can open presentations created in PowerPoint. Apart from Impress format, you can save your...  more »

I recently ran into the following error while trying to get Elmah to work / complie with my Web Application Project in Visual Studio 2010: Could not load file or assembly 'file:///C:\Users\DOUGDELL2\Documents\Visual Studio...  more »

At some point, you may need to disable Microsoft Security Essentials (MSE) in order to install other software. To disable MSE follow these steps: Open Microsoft Security Essentials Click on the Settings tab. In the left-hand menu, select Real-time...  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 »

By using iTunes, you are able to backup your settings, applications and personal data from an iPhone, iPad, or iPod Touch. You'll definitely want to backup your iPhone if you are upgrading to a newer iPhone model (or plan to sell your iPhone) so can...  more »

So my Logitech Wave keyboard was working just fine, then all of a sudden the Space bar key got stuck in the down position. It actually happened while cleaning the keyboard and it's keys (although to be honest, at the time it happened I didn't completely...  more »

The Windows Task Manager can be used to start programs, to end running applications, to start or to end processes, as well as to view a dynamic display of your computer's performance. To be able to start the Windows Task Manager, you can use any one of...  more »

Wordpress is a blogging application that provides basic content management to those who manage their own website blogs. It is free and available for download at Wordpress.org and is the most commonly used program for bloggers. A blog is essentially a...  more »

Here's one quick fix for the ASP.NET error System.FormatException: Input string was not in a correct format. when you are using a DataList with an asp:Button control and are trying to get the CommandArgument using the DataList_RowCommand. Keep in mind...  more »

Excel makes it easy to capitalize the first letter of every word in a cell. To capitalize each word you simply need to use the formula =PROPER(). For instance, if you have data in the cell A1, then you would want to enter the following formula in cell B1:...  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 »

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 »