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


A regular expression for validating a image url.  more »

Use a Laptop Cooler Cooling Pad to keep Laptop from Overheating in Hot Summer Temperatures  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 »

Learn how to get the latest security updates and service packs for your Microsoft Windows computer.  more »

Find out how-to take a snapshot of what’s on your computer screen and turn the screenshot into an image using graphic software. You'll learn how to take a screenshot of your entire computer screen or just a selected window.  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 »

This step by step will show you how to scan a picture using Windows‌ Photo Gallery, which should come installed by default on Windows Vista and Windows 7 operating systems. Once pictures are scanned using Windows Photo Gallery, your pictures are...  more »

For the longest time, I've had a problem of not being able to see all the folders in my Pictures folder when using the Browse button on websites to upload a picture (or file) in Internet Explorer 11 (or in IE10). For whatever reason, some of the folders...  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 »

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 »

I recently upgraded to Windows 7 Home Premium on my Dell Inspiron laptop. After using the laptop for a few days, I noticed that the screen display brightness was much dimmer than what it had been when Windows Vista was installed on the laptop. To solve my...  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 »