HTML and CSS Reference
In-Depth Information
#sidebar1, #sidebar2 {
width: 25%;
padding: 0 2% 10px 2%;
background-color: #CC9;
display: table-cell;
}
#main {
width: 50%;
padding: 0 2% 10px 2%;
display: table-cell;
}
h1 {
background-color: #74685A;
margin: 0;
padding: 10px;
color: #FFF;
display: table-row;
}
#footer {
background-color: #252017;
color: #DB9924;
padding: 10px;
display: table-row;
}
This has the desired effect of putting the header and footer in separate rows from the columns,
but as Figure
12-15
shows, they span only the first column.
Figure 12-15.
The header and footer don't stretch across all three columns
