Friday, August 22nd, 2008

How to select even or odd rows in a table using CSS 3

Filed under: Science and Technology — Daniel Lemire @ 14:08

CSS 3 is around the corner. Already we are seeing some benefits. The latest versions of Safari and Opera, as well as the beta version of Firefox allow you to select even or odd rows in a table using only CSS:


tr:nth-child(2n+1) {
background-color: blue;
}
tr:nth-child(2n) {
background-color: red;
}

See? No ECMAScript, no server-side programming. Alas, no sign of support for this in Internet Explorer.

2 Comments »

  1. When you say IE support, which versions? ie6+, ie7+, ie8+?

    Comment by staiano — 23/8/2008 @ 14:52

  2. I do not think it is supported by any version of IE.

    Comment by Daniel Lemire — 23/8/2008 @ 17:20

RSS feed for comments on this post.

Leave a comment

Warning: When entering a long comment, please ensure that you make copy of your text prior to submitting it. If the server should fail or if you hit a bug, you might lose your work. I am not responsible for your lost effort.

To spammers: I carefully review every single post and make sure that spam gets deleted. You are wasting your time if you are manually entering spam using this form. Read my terms of use to see what I consider to be abusive.

Example: I + II + IX= XII. Yes, you have to enter a roman numeral. (Answer must be in upper case.)

« Blog's main page

30 queries. 1.260 seconds. Valid XHTML

Powered by WordPress

© 2004-2008, Daniel Lemire (lemire at acm dot org). This work is licensed under a Creative Commons License.

Subscribe to this blog in a reader or by Email.