This is the table I need I can get the first and second rows easily, but when I try to make the third row good, I'm breaking the second row.
I tried using width attribute and colspan but nothing worked.
<table border="1px" width="100%"> <tr> <td colspan="6">Cell 1</td> </tr> <tr > <td colspan="3">Cell 2</td> <td colspan="3" >Cell 3</td> </tr> <tr> <td colspan="2">Cell 4</td> <td colspan="2">Cell 5</td> <td colspan="2">Cell 6</td> </tr> </table>
<table>
will fit its content by default, so each column does not need to be equal width. So manually assign equal column widths by assigningtable-layout:fixed
to<table>
and then assign each width to the first< ; in
of the first<thead>
to allocate equal width to each column. tr>or missing allocated width for
<td><tr>
(of coursetd
orth
also works as a selector), see example below.