Question

Minor cosmetic issue.. I am in the process of developing a forum based site with dynamic PHP tables that include headers and footers. I currently have a CSS conditional statement for alternating background colors for even and odd rows in my tables.

<!-- IF forumrow.S_ROW_COUNT is even-->
   <li class="row" style="background-color:#536482;">
<!-- ELSE -->
   <li class="row" style="background-color:#E0EBB2;">
<!-- ENDIF -->

My issue is that the common footer of my tables are the same color as the even count in my conditional statement and it would look kind of weird, like it would make the footer look larger than it actually is if it were the same color as the last row, that is if the table were to end on an even numbered row.

My question is if there is anything I can add to my conditional statement to make it start at the last row of my tables? Then the last row against the footer would always be #E0EBB2.

Thanks in advance.

Answer 1

You can use just the css pseudo selector nth-last-child and nothing more.

Try it:

ul li {
   background-color: #536482;
}

ul li:nth-last-child(odd) {
    background-color: #E0EBB2;
}

Working example here.