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


Windows 7 has made definite improvement to the CD/DVD burning software that is included for free in the Operating System. It's now possible to burn ISO image files directly from the explorer window in Windows 7 using your CD or DVD burner. In past...  more »

Here's how you can quickly remove multiple Blank cells in Excel: 1) Select the area of cells or columns you want to have blank cell spaces removed. 2) Then press "Ctrl" + "G" on your keyboard.. this will pop-up the Go To box. 3) Now press "Alt" + "S" on...  more »

When developing websites or applications in Visual Studio.NET, you sometimes need to have Visual Studio run as an administrator. For instance, if you are developing a Web Application Project that uses IIS7 as the local development server for testing,...  more »

Below are the steps to update the firmware on a Linksys E4200 Router. Before getting started make sure you download the latest firmware version to your computer from the Linksys site, go to http://support.linksys.com/en-us/support/routers/E4200 and click...  more »

Learn how to manually initiate the transferring of pictures to your computer with Kodak's EasyShare software.  more »

I just installed the URL Rewrite Module for IIS 7.0 and started playing around with how to setup rules to create search engine friendly URLs. The first rule I decided to setup was to redirect a site to the WWW sub-domain version when it was not typed in...  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 »

By default, the Quick Launch bar is not enabled on the Taskbar in Windows 7, as it was in Vista and XP. Instead, you're able to drag and pin programs to the Taskbar in Windows 7 for quick access to programs. However, if you want to bring back the Quick...  more »

Are you having trouble installing the Google Adwords Editor on Windows Vista? I was getting a pop-up 'Error 2739' every time I went to install it on my Vista machine. Here's a the solution that worked for me, which allowed me to successfully install Google Adwords Editor on my computer.  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 »

UPDATE 12-16-2011: For those of you who are getting an "sgen.exe" error message when trying to building your project in Visual Studio that reads something like "Could not load file or assembly or one of its dependencies. Operation is not supported. SGEN"....  more »

I recently moved my sites over to a new web server that has "Windows Server 2008 R2" installed. The older server had just been running "Windows Server 2008". After moving my sites over I discovered that my AJAX Toolkit AutoComplete functionality had...  more »