HTML and CSS Reference
In-Depth Information
Example 2.20: providing table alignment and spacing
(continued)
<thead>
<tr>
<th></th> <th>
lunch
</th> <th>
dinner
</th>
</tr>
</thead>
<tr>
<th>
kitchen
</th> <td>
23
</td> <td>
30
</td>
</tr>
<tr>
<th>
dining room
</th> <td>
31
</td> <td>
45
</td>
</tr>
</table>
</body>
</html>
Figure 2.20: A table with good alignment and spacing
Numeric data in a table looks better when aligned on the right. his CSS
statement
thead th { text-align: right; }
speciies right alignment for table head cells with the
thead
element. he state-
ment following that speciies let alignment for the th elements used as row
labels. he padding property for both
th
and
td
elements is given the value
3px 6px
, which is a shorthand way of saying 3 pixels for the top and bottom
padding and 6 pixels for the let and right padding. he table shown in