22nd August 2008, 1 min read

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

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.