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


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 »

I recently began getting a "Storage Almost Full" message on my 16GB iPhone 5. After deleting most of my photos and videos from my iphone and unsyncing all music, I still had only freed up a few GBs of space. Also in iTunes, it was still showing I had 4...  more »

If you want to have two seperate Microsoft Excel files open that are separate from each other, that don't load within the same instance of Excel, then keeping reading to find out how to get around this limitation.  more »

Zipping a file or folder up can be a great way to compress the file in order to make the file size smaller and easier to manage. It can be especially useful when you want to send a large file to someone via email, since most email hosts limit the file...  more »

How to implement a StopWords filter in C# that will filter out certain woulds from a query.  more »

Ever since I discovered F.lux for my desktop computer (F.lux helps get rid of of blue screen light at night from your computer monitor), I've been waiting for Apple to enable this functionality on the iPhone screen. Staring into a computer/phone screen...  more »

Today Apple released it's latest operating system, iOS 7.0 for iPhone and iPad devices, along with the newest version of iTunes 11.1. So to get the latest and greatest iOS for your iPhone or iPad here's how you can download and install iOS 7.0. NOTE: Just...  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 »

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 »

By default the Quick Launch bar is no longer enabled in Windows 7, which is where the Show Desktop shortcut icon button resided in previous version of Windows. Don't worry, the Show Desktop feature is still included in Windows 7, it's just been redesigned...  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 »

Early today, I received an email from my Grandma who will turn 90 years old in just a few months asking me the following question: "How do I delete two or three files at one time?" In order to answer this somewhat complicated process and make it...  more »