"display: table" as a substitute for TABLE for layout

	There are a lot of pages out there where blocks of content are
arranged for visual purposes using HTML tables.  This structure is
supposed to be deprecated in HTML 4.0, but in practice it is difficult
to work out the corresponding CSS construct, especially if the
TABLE-based layout was unconcerned with the precise width of the
cells.

	However, in the CSS2 spec
<http://www.w3.org/TR/REC-CSS2/visuren.html#value-inst-table>, the
following are listed as possible values for the 'display' property:

  table, inline-table, table-row-group, table-column,
  table-column-group, table-header-group, table-footer-group, table-row,
  table-cell, and table-caption

	 These values cause an element to behave like a table element
	  (subject to restrictions described in the chapter on tables).

This would seem to imply the following "quick fix" for any document
laid out with HTML tables: convert <TABLE> to <DIV
STYLE="display:table">, <TR> to <DIV STYLE="display:table-row"> and
<TD> to <DIV STYLE="display:table-cell">, and transfer various
presentation attributes to CSS directives.  This has the following
advantages:

	* Intelligent agents (or, for instance a TABLE-to-PRE
converter for Lynx users) can be confused by TABLEs which do not
actually contain tabular data; this moves the layout function to the
CSS sphere where it belongs.

	* For the time being, browsers know how to format text in
tables, but they're not so good at floating blocks of text.  Using the
'display' property means user agents will either treat the DIVs like
the corresponding table elements, or ignore them.  With more
sophisticated layout models, the current generation of user agents
(notably Netscape) is more likely to render a page illegible by
overlaying bits of text atop one another.  Broken implementation of
stylesheets is given as an excuse for retaining visual formatting with
TABLEs, but if this construct is valid, it would seem to remove that
problem.  (Except that your page would end up degrading on almost all
platforms for the time being.)

	* Replacing table elements with DIVs allows authors to replace
table-based visual formatting now, before climbing the learning curve
of the CSS visual rendering model.

	Of course the question is whether any current browsers support
the 'display' property.  If not, we ought to be able to convince them
to do so for DIV (and perhaps SPAN) at least, since in that case it's
not really overriding any pre-defined characteristics.  And this
application would seem to be easy to build into the browsers, since
the layout model is one they already know.

	Thoughts?
					John T. Whelan
					whelan@iname.com
					http://www.slack.net/~whelan/

Received on Saturday, 22 August 1998 18:21:51 UTC