HTML and CSS Reference
In-Depth Information
h e
story
class is a container for ordering dif erent sections that are assigned
col1
or
col2
classes. However, the
col1
and
col2
classes do not have to be placed in a table. Notice that
the two graphics — one each in the two dif erent table-cell classes — are dei ned using
<div>
tags within the
<header>
container. h ey're then used again inside the
<article>
container that has been assigned a
story
class (table). h e two sections have been dei ned as
col1
and
col2
displays, and although they're not seen in the containers for the two graph-
ics, you can see that dif erent colored text helps to show their separate status. Figure 6-1 shows
what you can expect to see in your browser.
112
Figure 6-1: Using the CSS3
display
property with table values.
As you can see in Figure 6-1, using table-cells is an easy way to set up multiple columns.
When you develop more sophisticated Web sites, you'll want to use more advanced CSS3
display dei nitions beyond tables and table-cells, but the
table
property in CSS3 is available
when you need it.
TABLES AND TABULAR DATA
Keeping in mind that we'll get an electrical shock if we use standard table markups for site
design, this next section takes a close look at how to use tables for displaying tabular data.