My Location

Apr 8, 2009

Styling table columns

It seems so natural to want to set colour and alignment on columns of a table. But CSS2.1 does not allow it, it only allows you to set width, visibility, border and background. Hixie explains why. Internet Explorer supports it, but no-one else does.

The workaround is to use CSS selectors as follows:

#table55 td:first-child { text-align:left; } /* col 1 */
#table55 td:first-child+td { text-align:center; } /* col 2 */
#table55 td:first-child+td+td { text-align:right; } /* col 3 */

This works in CSS-compliant browsers including IE7 and above. Thanks to Simon Pieters for this one.

No comments:

Post a Comment