Use CSS3 in applications - Programming in HTML5 with JavaScript and CSS3 - page 280

Implementing a layout using grid alignment
The grid layout capability of CSS3 provides a way to lay out the content of the webpage much
like an HTML table but using only CSS to achieve the results. This provides more flexibility and
more maintainable code.
To demonstrate the capability of the grid layout with CSS3, you will build a webpage
layout that looks like the one in Figure 4-46.
FIGURE 4-46 The webpage you will create using the grid layout capability in CSS3
Traditionally, to achieve this layout, you would have likely created an HTML markup such as
the following code:
<table border="1" style="width:100%; height: 85%">
<tr>
<td colspan="3">
</td>
</tr>
<tr>
<td rowspan="3">
</td>
<td rowspan="3">
</td>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td colspan="3">
</td>
</tr>
</table>