Aligning Table Cell Contents

By default, the content of TH cells is centered and the content of TD cells is left-aligned.

HTML 4 includes three table elements, the THEAD, TBODY, and TFOOT elements, that can be used to create groups of row groups. These let you, for instance, apply different formatting to header, body, and footer sections within a table.

In the following example, you style the TBODY element to set left- alignment for table rows nested within that element. You also style the THEAD element to set bottom-alignment for the table rows nested within that element. Just edit your style sheet, as shown here (see Figure 12.9):

 th { padding: 4px 6px; border: 1px solid black; } td { text-align: left; padding: 4px 6px; border: 1px solid black; ...

Get Cascading Style Sheets (CSS) by Example now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.