|
|
The TABLE ElementHTML 3.2 and Netscape 3.0Contents
IntroductionThe TABLE element defines a container for a table definition. A table consists of an optional CAPTION, followed by rows (<TR>...</TR>) containing data or header cells (TH/TD). TABLEs can be aligned left, right, or center. Text wraps around tables with ALIGN=LEFT and RIGHT. A simple table looks like this:
HTML 3.2 uses the "widely deployed subset of the full table standard," as defined in the May 1996 Request For Comments number 1942 (RFC 1942 (http://www.ics.uci.edu/pub/ietf/html/rfc1942.txt). The HTML 3.2 DTD defines a stripped down version of this rfc, which closely matches Netscape's implementation of tables in May 1996. Highlights include compatibility with the latest Netscape and Microsoft browsers' WIDTH, BORDER, ALIGN, VALIGN, and CELLPADDING/SPACING attributes. Netscape 3.0's version of tables [NC 95d] is now nearly identical to the HTML 3.2 DTD. Netscape 3.0 adds the BGCOLOR attribute to table cells, which allows the background color of individual cells to be set. Here is a short description of how tables work from rfc1942 of May 1996. Tables start with an optional caption followed by one or more rows. Each row is formed by one or more cells, which are differentiated into header and data cells. Cells can be merged across rows and columns, and include attributes assisting rendering to speech and braille, or for exporting table data into databases. The model provides limited support for control over appearence, for example horizontal and vertical alignment of cell contents, border styles and cell margins. You can further affect this by grouping rows and columns together. Tables can contain a wide range of content, such as headers, lists, paragraphs, forms, figures, preformatted text and even nested tables.Note: The TH and TD elements can contain body.content, (headers, lists, etc.) while other elements such as captions can only contain text-type content (characters, character emphasis elements, IMG and anchors). The CAPTION elementThe CAPTION element contains the table's caption or title. It is normally used to label tables or figures. HTML 3.2 allows any text-type element for CAPTIONs, while Netscape 3.0 allows any body tags (like H2). It should immediately follow the TABLE element. The ALIGN attribute can be set to TOP (the default) and BOTTOM. It is always centered horizontally in relation to the table width. Ex: Usage<TABLE><CAPTION><H2>Tables with an H2, a no no</H2> - WRONG
<TABLE> ALIGNment of TABLEsThe alignment of cell contents can be specified on a cell by cell basis, or inherited from enclosing elements, such as the row, column or the table element itself. The ALIGN attributeThe ALIGN attribute in the HTML 3.2 draft can be left, center, or right. The default is center. Text can flow around a table (similar to the FIG tag) when left or right aligned. NHTML 3.0 and HTML 3.2 differ in how they center a table. NHTML uses a tag, while HTML 3.2 properly uses an attribute to the TABLE tag. There are now two ways to center a table in NHTML 3.0: by using the <CENTER> tag or the ALIGN=CENTER attribute to the new HTML 3.0 <DIV> tag. The HTML 3.2 way is to use the ALIGN=CENTER attribute of the TABLE tag. (Note: Netscape 3.0 does not support the ALIGN=CENTER attribute of the TABLE tag). Since HTML 3.2 ignores tags it does not recognize you can do both: Usage<CENTER><TABLE> <TR> <TD>Centers in Netscape</TD> <TD>Datagram</TD> </TR> </TABLE> </CENTER> - DISCOURAGED, but now legal in HTML 3.2
<CENTER> or
<DIV ALIGN=CENTER> or
<TABLE ALIGN=CENTER> *Recommended until Netscape supports TABLE ALIGN=CENTER. You could remove the <DIV&DIV&DIV&&DIV&&&> tags once this occurs. Inheritance Order Alignment properties can be included with most of the table elements: TR, TH and TD. When rendering cells, horizontal alignment is determined by columns in preference to rows, while for vertical alignment, the rows are more important than the columns.The WIDTH attributeThe WIDTH attribute sets the desired relative width of the table as a percentage of the screen width between margins. The WIDTH attribute (percentage) is now compatible with Netscape (for the TABLE tag). The default width of a table is 100% of the available page. Note that NHTML allows an absolute width (i.e., <TABLE WIDTH=465> in pixels) which is not supported in the HTML 3.2 DTD. Usage<TABLE WIDTH=400> or WIDTH=75% - WRONG The WIDTH attribute had been dropped from the TH and TD tags in the latest (October) Table draft, but is now back in the HTML 3.2 specification. The suggested width in pixels can be used for TH/TD cells. Netscape allows a relative width (i.e., <TD WIDTH=50%>) which is not included in the HTML 3.2 DTD. The BORDER attributeThe BORDER attribute is now compatible with Netscape and Explorer. The BORDER attribute can be used alone as a value (i.e., <TABLE BORDER>) or as an attribute (i.e., <TABLE BORDER=2>) which specifies the width of the border drawn around the frame. The default is no border. CELLPADDING and CELLSPACING attributesThese two Netscapisms have now become part of the HTML 3.2 specification, deploy it and they will come. The CELLPADDING controls the spacing within cells, while CELLSPACING controls the spacing between cells. All units are in absolute pixels. Usage<TABLE BORDER=5 CELLPADDING=10 CELLSPACING=5> - RIGHT<TABLE BORDER=1 FRAME=hsides RULES=cols CELLPADDING=5 CELLSPACING=5> - HTML 3.0 (expired) The BGCOLOR Attribute
Usage
<CAPTION>Color Cells</CAPTION> <TR> <TD BGCOLOR="#bbffee">Green</TD> </TR> <TR> <TD BGCOLOR="#ffbbcc">Red</TD> </TR> </TABLE> - NHTML 3.0 <TABLE ALIGN=RIGHT BORDER=1 WIDTH="20%"> <CAPTION CENTER ALIGN=BOTTOM>Color Cells</CAPTION> <TR> <TD>One Color</TD> </TR> <TR> <TD>Same darned Color</TD> </TR> </TABLE> - RIGHT Table rowsThe TR element is a container for a table row. The number of rows in a table is defined by the number of TR tags. The closing </TR> tag is optional, but recommended. The TR tag is identical in both NHTML and HTML 3.2. TR attributes are ALIGN and VALIGN. Using <TR ALIGN=CENTER> is a quick way to center every cell in a row. UsageTable cellsThe TD tag is a container for a table data cell. Not all rows must have the same number of data cells, the total number of columns in a table will be the number of data cells and COLSPANS in the longest row. The TD and TH tags behave similarly in both HTMLs. The TD and TH tags can contain any body content (see the note above). The HTML 3.2 TD/TH attributes are NOWRAP, ROWSPAN, COLSPAN, ALIGN, VALIGN, WIDTH (pixels), and HEIGHT (pixels).
By default, cell contents are vertically aligned at the middle of each cell. The VALIGN attribute works the same in both HTMLs and can override this default. It can have one of three values: TOP, MIDDLE, BOTTOM or BASELINE. Both HTMLs support left, center and right values for the ALIGN attribute. Both HTMLs support the COLSPAN and ROWSPAN attributes. Note that the closing </TD></TH></TR> tags are optional in HTML 3.0, but should be included as some browsers require them in order to render tables properly (as I discovered with Netscape 1.1 although Netscape 2.0 works). Usage<TD WIDTH="50%" NOWRAP>some data</TD> - NHTML
Recent ChangesSome corrections and clarifications to this document were made recently, based on e-mail from kind souls that took the time to write in and the author's own validation experience.
| ||||||||||||||||||||||||||||
Comments are welcome
| ||||||||||||||||||||
Revised: Jan. 31, 1997
URL: http://webreference.com/html3andns/table.html
