Using the PRE Element to Format Tabular Data

Prior to the inclusion of tables in HTML, tabular data had to be displayed using the PRE (Preformatted Text) element. The PRE element allows the display of tabular format because all spaces and hard returns included in the text are displayed, rather than ignored. In the example file, columns and rows are created using spaces and hard returns, but these are ignored because they are not contained inside of a PRE element (see Figure 5.1).

Figure 5.1: Multiple spaces and hard returns are ignored by a browser, if not contained within a PRE element.

To display the spaces and hard returns included in the table, bracket it with a PRE element (see Figure 5.2):

<pre>
Alberts     $160,251     $245,600     $132,000     $537,851

Brown       225,255      115,995      132,875      474,125

Gilbertson  240,168      390,295      175,000      805,463

Sikorsky    100,678      185,343      260,825      546,846

Yang        265,015      333,838      148,345      747,198

Totals      $991,367     $1,271,071   $849,045     $3,111,483
</pre>

Figure 5.2: Inside of the PRE element, multiple spaces and hard returns are displayed.

Tip

Many spreadsheet programs can export data as "print" files (with a .prn file extension) that preserve the spaces between data columns. In Microsoft Excel, for instance, to export your worksheet as a print file, select File, Save As, and specify the file type as Formatted Text (Space delimited) (*.prn). Saving your worksheet as a text file, rather than as a PRN file (or "print" file), eliminates all but one space between the data columns. The PRN file type was originated by Lotus 1-2-3.