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


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 »

Here's a couple quick SQL database tips for finding and deleting duplicate values in a SQL Server table.To find duplicates in a Column use the following SQL: SELECT ColName1, COUNT(*) TotalCountFROM TableName GROUP BY ColName1 HAVING (COUNT(ColName1) >...  more »

You may need to have an image refreshed automatically on a web page in ASP.NET to get the latest image. One instance where you might want the fresh image is if you upload an image that has the same file name as an already existing image file on the...  more »

I recently discovered an issue after I upgraded to TinyMCE 4.1.3 version text editor in my ASP.NET web pages that was causing the formatting of my <pre> tags to not keep its line break formating on PostBack. At first I thought this might be a CSS...  more »

So if you're like me, you may be happy with Windows 7 (or 8.1) on your current computer or laptop, and have no interest in upgrading to Windows 10. But you may also be getting bombarded by Microsoft to upgrade to Windows 10, with the Windows 10 upgrade...  more »

Here's how you can quickly pair your Apple AirPods with your Windows PC.  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 »

Learn how to add two or more cells together in Microsoft Excel.  more »

I recently dealt with an issue of external images not showing in Reporting Services (SSRS) report viewer control within an IIS7 website. When the IIS7 website had it's Application Pool's Managed Pipeline Mode set to "Classic", the external images showed...  more »

Today, Microsoft released new FREE Anti-virus and malware protection software called Security Essentials. Microsoft Security Essentials (MSE) is a real-time anti-virus scanner that anyone can download for free and use for personal use. You can use...  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 »

This tutorial goes through the steps of how to import a SQL script file into a MySQL database.  more »