This morning at work I came across ColdFusion code that was written less than a year ago by one of the developers, which is doing alternate row colours for <table>. Below is the code that looks similar to the code:
<style>
.even_row td {
background-color: #F2F2F2;
}
.odd_row td {
background-color: #FFFFFF;
}
</style>
<table>
<cfoutput>
<cfloop index = "LoopCount" from = "1" to = "1000">
<tr class="#IIf(LoopCount Mod 2, DE('odd_row'), DE('even_row'))#">
<td>Row number is #LoopCount#.</td>
</tr>
</cfloop>
</cfoutput>
</table>
In the above code, you can see each iteration is trying to find out if current row is odd or even, and then assigning the CSS class to each row of the table.
Same thing can be done with only CSS and without having ColdFusion trying to figure out odd and even rows. Here is how it can be done with only CSS:
<style>
.testTable tr:nth-child(odd) {
background-color: #F2F2F2;
}
.testTable tr:nth-child(even) {
background-color: #FFFFFF;
}
</style>
<table class="testTable">
<cfloop index = "LoopCount" from = "1" to = "1000">
<tr>
<td>Row <cfoutput>#LoopCount#</cfoutput>.</td>
</tr>
</cfloop>
</table>