Perhaps as a result of a generic need to be able to describe table layout -- something CSS1 lacks -- CSS2 includes a handful of features that apply directly to tables and table cells. First, there are 10 new table-related values for display:
table inline-table table-column-group table-column table-row-group table-row table-cell table-caption table-header-group table-footer-group
While the effects of most of these are obvious from their names, at least two may not be familiar to you. table-header-group and table-footer-group are used to mark the header and footer of a table. These are displayed, respectively, above or below all the rows of the table, but not outside of the table's caption.
Another interesting effect is that you can align text on a character by using the text-align property. For example, if you wanted to line up a column of figures on a decimal point, you might declare:
TD { text-align: "." }
As long as a set of cells are grouped into a column, their content will be aligned so that the periods all line up along a vertical axis.
Far from relying on existing properties, CSS2 provides a whole array of brand-new properties in the table section. Here are a few of them:
border-spacing, which influences the placement of borders around cells
border-collapse, which can be used to influence how the borders of various table elements interact
table-layout, which tells the browser whether or not it can resize the table as necessary
There are also properties describing how visibility and vertical-align are applied to tables. There is also a caption-side property, which functions exactly the same as the ALIGN attribute on the <CAPTION> tag, and the property speak-header-cell, which controls how header cells are handled by speech-generating browsers (more on that later).
Copyright © 2002 O'Reilly & Associates. All rights reserved.