Search code examples
cssasp.netcss-tables

Table layout odd and even rows

I have a table that is generated and filled with data in the code behind. I give it the CSS class test with the cssClass attribute. Now I want to give the odd and even rows different colors. But when I try to use the normal CSS code for it, it does not work.

This is my CSS code:

<style>
.test
   {
    tr:nth-child(even) {background: #CCC}
    tr:nth-child(odd) {background: #FFF}
    }
</style>

and this is the code behind code where I add the cssClass

tableData.CssClass = "test";
Solution

  • You're trying to nest CSS rules which is only possible in less/sass etc.

    Try this:

    .test tr:nth-child(even) {
background: #ccc;
}
.test tr:nth-child(odd) {
background: #fff;
}

    The :nth-child() selector is supported in all major browsers, except IE8 and earlier.