Zebra tables on steroids
I’ve been thinking about the well known A List Apart article: Zebra Tables. I’ve always thought this approach to row highlighting had potential as a workaround until CSS3 selectors are widely supported.
The problems
The problem with the “zebra tables” script is it applies background-colors directly to the <td>
s of the table, instead of allowing CSS to do it’s job.
Another issue is that “zebra tables” does not handle colspan
s or rowspan
s correctly (the colours continue out of alignment).
It would be nice if the script supported column highlighting also.
The solutions
The checkerboard script improves on “zebra tables” by applying classes to alternating <tr>
s instead of colours directly to the <td>
s, so the colours can
be handled seperately in the CSS.
Checkerboard goes one further, allowing columns to be highlight also, if desired.
It achieves this by adding classes to alternating <td>
s within each <tr>
which can then be targeted by CSS and styled appropriately.
Checkerboard also compensates for colspan
s or rowspan
s correctly, so your complex tables are safe.
Working example
A demonstration of the checkerboard tables is available.
Download
Checkerboard tables is licensed under the The GNU General Public License (GPL), by downloading it you are agreeing to abide by the terms of that license.
By tinymac » Blog Archive » Zebras on Steroids? March 14, 2006 - 4:34 am
[…] For more information and downloads see: Checkerboard Tables. […]