<td><img src=”thought.jpg”><br />
A friend in contemplative thought, reduced to grayscale.</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
The second table is set to auto, and thus the browser is allowed to stretch
those cells so that they widen to display the entire contents, as you can see
in the table on the right in Figure 12-7. (For a detailed discussion of auto, see
Chapter 11.)
Avoiding properties not supported by IE .......................................
The caption-sideproperty is intended to add a brief bit of descriptive text
or a caption or title, to the top, right, bottom, or left of a table. It doesn’t work
in Internet Explorer 6 or earlier, so avoid it. Plus, it’s pretty ugly even when
it’s working.
IE ignores or improperly handles these three CSS properties as well: border-
collapse, border-spacing, and empty-cells. These properties attempt to
govern how borders are displayed, including drawing no border if a cell con-
tains no content (empty-cells). However, until IE responds to these proper-
ties correctly, employing them is clearly not a good idea.
Doing Without Tables .................................................................................
For years, the dream of many Web page designers has been to find some way
to avoid relying on the extensive, bloated code required to lay out a Web
page using tables and spacer images. CSS positioning brought us much closer
to that elusive goal. If you assume that 95 percent of your Web page’s audi-
ence is using Internet Explorer, and that very few are using the old renegade
Netscape 4, you can move a table-based layout over to CSS style without feel-
ing guilty or worrying that some users see havoc on their screen. CSS posi-
tioning is now widely accepted and results in essentially predictable effects
in browsers. Here are the two primary advantages of designing a page using
CSS rather than tables:
216 Part III: Adding Artistry: Design and Composition with CSS