I'm having trouble using CSS to create two boxes (one red and one green) inside a table cell. I can't seem to make them fill the entire height of the cell.
Here is what I have tried so far:
td {
background-color: lightblue;
padding: 5px;
}
td.boxes {
padding: 0
}
div.a {
display: inline-block;
width: 3px;
background-color: red;
}
div.b {
display: inline-block;
width: 3px;
background-color: green;
}<table>
<tr>
<td>Mj</td>
<td class="boxes">
<div class="a"> </div><!--
--><div class="b"> </div>
</td>
</tr>
</table>