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


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 »

Having strong yet easily memorized passwords is crucial to protecting your personal information on the internet or your computer. Most people use passwords for many day to day online activities - checking your e-mail, paying your bills, logging into your...  more »

This tutorial goes through the steps of how to import a SQL script file into a MySQL database.  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 »

In the code below, you will be able to find the baseUrl of your website using javascript. The following javascript code will work when used on your localhost or when it's used in a live site (finds the root url of the domain address). Just add this...  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 »

After installing Windows 7 (or Windows Vista) you may want to check to see if the software was actually activated. Follow these steps to determine whether your copy of Windows has been activated successfully: Go to 'Control Panel'. Click on 'System and...  more »

Email messages sometimes are sent with images attached, which make saving the images to your computer fairly easy. However, sometimes the pictures are only embedded within the actual email message without the ability to download any attachments. This can...  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 »

Windows operating systems (such as Windows Vista), every file extention is associated with a default program. When you open a file, the program that is associated to the file extension will open the file by default. However, you can change or set the...  more »

If you ever wanted to change a field to null in a Sql Server 2005 Management Studio result set, you're in luck because there is a quick and easy way to do it.  more »

UPDATE: The better way to do this is to use TinyMCE "rel_list" in the javascript for TinyMCE as seen here. Rather than changing the code in the plugin.min.js file, as shown below (after this update). Also just to note that in TinyMCE version 4.5 they...  more »