yasseen
2/11/2015 - 9:09 AM

Table Columns with Alternating Colors using CSS3

Table Columns with Alternating Colors using CSS3

Table-Columns-with-Alternating-Colors-using-CSS3.html
content_copyfile_download
<table class="tableCol">
	<tr><td>Text</td><td>Text</td><td>Text</td><td>Text</td></tr>
	<tr><td>Text</td><td>Text</td><td>Text</td><td>Text</td></tr>
	<tr><td>Text</td><td>Text</td><td>Text</td><td>Text</td></tr>
	<tr><td>Text</td><td>Text</td><td>Text</td><td>Text</td></tr>
</table>
Table-Columns-with-Alternating-Colors-using-CSS3.css
content_copyfile_download
.tableCol{
	width:100%; 
	border-collapse:collapse; 
}
.tableCol td{ 
	padding:7px; border:#4e95f4 1px solid;
}
/* improve visual readability for IE8 and below */
.tableCol tr{
	background: #b8d1f3;
}
/*  Define the background color for all the ODD table columns  */
.tableCol tr td:nth-child(odd){ 
	background: #b8d1f3;
}
/*  Define the background color for all the EVEN table columns  */
.tableCol tr td:nth-child(even){
	background: #dae5f4;
}