I did the nth child rule in css but it the colors are not alternate. Colors are all the same each rows and columns. My code is a multiplication table with a supposed alternate color. Im having a hard time knowing what I should do to modify or add in my php code to create the desired output (alternate colors in rows and columns in the multiplication table).
Below is my php code:
<?php
for($row=0; $row<=10; $row++){
echo "<tr>";
for($column=0; $column<=10; $column++){
if($row==0 && $column==0){
echo "<td></td>";
}
else{
echo "<td>". $row * $column. "</td>";
}
}
}
echo "</tr>";
?>
CSS code:
table, th, td {
border: 1px solid black;
}
td {
padding: 15px;
}
.bold{
font-weight: bold;
font-size: 1.3em;
}
table tr:nth-child(odd) {
background-color: yellow;
}
table tr:nth-child(even) {
background-color: red;
}
you forget to use the <table> tag and your CSS address it from the table.
<?php
echo "<table>";
for($row=0; $row<=10; $row++){
echo "<tr>";
for($column=0; $column<=10; $column++){
if($row==0 && $column==0){
echo "<td></td>";
}
else{
echo "<td>". $row * $column. "</td>";
}
}
echo "</tr>";
}
echo "</table>";
?>