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


So yesterday I downloaded the new version of iTunes 9, and updated my iPhone with OS version 3.1. Everything seemed to be working great until I went to play my podcast playlists on my iPhone. The podcast playlists were not syncing to my iPhone for some...  more »

So here's a quick tip on how to fix the following SQL Server "SqlDateTime overflow" error. System.Data.SqlTypes.SqlTypeException SqlDateTime overflow. Must be between 1/1/1753 12:00:00 AM and 12/31/9999 11:59:59 PM. The reason that you are probably...  more »

If you do any sort of ASP.NET programming there usually comes a time when you need to get a websites Base URL. The following shows two examples, the first example shows how to get the Base Site Url using C#, which can be used for getting both the...  more »

Here's one way to setup your connection string for a SQL Server 2008 Express database for a live website using ASP.NET on Windows Server 2008. Open "Sql Server Configuration Manager" -> the click on "SQL Server Network Configuration" -> then click...  more »

Here's a cool little tip that I stumbled upon while previewing a photo using Windows Photo Gallery, which allows you to quickly rename the filename of a photo. In this example, I'm using Windows Vista and will be opening JPEG images. Windows Photo Gallery...  more »

This tutorial will teach you how to use the SUM function in Microsoft Excel to add column values together in order to calculate a total amount.  more »

Here's how you can enable SQL Server Authentication in a SQL Server 2008 database, and then add a User login and password account for connecting to the database. Open SQL Server Management Studio In the Object Explorer sidebar, right-click on the top SQL...  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 »

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 »

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 »

The Windows Live Messenger sign box will by popup by default on computer startup. This can be quite annoying especially if you don't even use the Windows Live instant messenger client. Luckily, you can easily turn off the Windows Live Messenger popup box...  more »

Here's a quick tip on how to get the Taskbar in Windows 7 to become visible while watching a flash video (YouTube, Vimeo, etc.) in full-screen mode. To get the taskbar to show while still in full-screen video mode, simply press the Windows (logo ÿ)...  more »