HTML and CSS Reference
In-Depth Information
the location of the page within your site (the Homepage, About, or Contact sections, for example),
you can create selectors with higher specificity to override generic settings.
Take for example a basic, two-column layout with a footer. The markup might look like
this:
<body>
<div id="content">
...
</div>
<div id="sidebar">
...
</div>
<div id="footer">
...
</div>
</body>
All we need next are a few basic rules to send the sidebar to the right and set a few other defaults,
and we have our standard layout (see Figure 3-15):
#content {
float:left;
width:74%;
}
#sidebar {
float:right;
width:25%;
}
#footer {
clear:both;
}
Figure 3-15.
A basic, two-column layout with a footer
Now, let's say that on the homepage we want to have the sidebar on the left (Figure 3-16),
and on our contact page, we don't want a sidebar at all (Figure 3-17). To accomplish this, we
