How can I create a table like the above example in HTML and CSS. I've tried the following:
<table> <tr> <td style="width:50%">TEXT</td> <td style="width:50%">TEXT</td> </tr> <tr> <td style="width:100%">TEXT</td> </tr>
but it won't work. Can anyone help?
You have two options. Use an extra column in the header, and use <colspan> in your header to stretch a cell for two or more columns. Insert a <table> with 2 columns inside the td you want extra columns in.
To make a cell span more than one column, use the colspan attribute.
The colspan attribute in HTML is used to set the number of columns a cell should span in a table. Use the colspan attribute on the <td> or <th> element.
Table cells can span multiple columns or rows using the colspan and rowspan attributes. These attributes can be applied to <th> and <td> elements.
You should use colspan
for your second row. Like this :
<table> <tr> <td style="width:50%">TEXT</td> <td style="width:50%">TEXT</td> </tr> <tr> <td colspan="2" style="width:100%">TEXT</td> </tr> ... </table>
For learn -> HTML Colspan
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With