Basic Web Design Tutorial Part 8

A complex table

This is a more complex table example. Complex layouts (with headers, footers, columns) might need this.

The COLSPAN and ROWSPAN attributes of the TD tag tell the browser that that TD stretches over multiple rows or columns. I find it helps to imagine the table being built up a row at a time from top to bottom and from left to right. The best way to get your head around this is to play around with it.

<html>
<body>
<h1>Example 9</h1>
<table border=”1″>
<tr>
<td colspan=”2″>
The Big Big Big Big Title
</td>
</tr>
<tr>
<td rowspan=”2″>
Block 1
</td>
<td>
Block 2
</td>
</tr>
<tr>
<td>
Block 3
</td>
</tr>
</table>
</body>
</html>

Example 9

Share this:
Share this page via Email Share this page via Stumble Upon Share this page via Digg this Share this page via Facebook Share this page via Twitter

Leave a Comment