Information - Resources - Tools - Strategies

HTML: The <pre> Preformatted Tag

Web browsers routinely disregard extra spaces and carriage returns, but every once in a while you may want your text to display exactly the way you lay it out. You can accomplish this by using the <pre> tag for preformatted text.

The browser renders preformatted text in a monospaced font. Each character in a monospaced font takes up the same amount of space. Courier is an example of a monospaced or fixed-width font.

The following example shows how you could use the <pre> tag to include source code in your web document:

	<pre> 
         		for (x=0; x<7; ++x) {
	   y = x;
                }
 	</pre>
	

          		for (x=0; x<7; ++x) {
	   y = x;
                }
	

Using <pre> to Construct Tables

You can create simple tables using the <pre> tag. First type the text for your table. Use the space bar to align the columns, then preformat the text. Check the results in your browser until it looks right.

<pre>
<strong>Consolidated Balance Sheet</strong>

		               1998          1999

Current Assets             $  8,114       $ 6,953
Securities                    1,007         2,650
Inventory                     4,119         4,693
Recoverable Costs             1,200         1,865
Prepaid Expense               2,500         1,970
Miscellaneous                 3,200         2,300
 
Total Current Assets       $ 20,140      $ 20,431
</pre>
	

	Consolidated Balance Sheet

                               1998          1999

Current Assets             $  8,114       $ 6,953
Securities                    1,007         2,650
Inventory                     4,119         4,693
Recoverable Costs             1,200         1,865
Prepaid Expense               2,500         1,970
Miscellaneous                 3,200         2,300

Total Current Assets       $ 20,140      $ 20,431
	

NOTE: Keep in mind that the <pre> </pre> container tags do not allow browsers to automatically wrap long lines of text placed between them. This would require the viewer to scroll sideways in order to read your information. Therefore, make sure your text lines are reasonably short so they can be viewed without scrolling.

« Previous