Head First HTML with CSS

Time for the absolute test drive
Make sure you’ve saved the new CSS and then reload
“index.html” in your browser. Let’s check out the results:
Wow, this looks amazingly
like the float version;
however, you know that
the sidebar is being
positioned absolutely.
The main content area has
a margin that is exactly
the width of the sidebar,
and the sidebar sits on top
of that space.
layout and positioning
As you resize the
browser, the sidebar
always sits 128 pixels
from the top, and sticks
to the right of the page.
And the sidebar has a 10
pixel right margin, so it
has spacing between it and
the edge of the page.
And we’ve still got a
nice gutter between
the two columns.
But we are now back to having a problem with the
footer. When the browser gets wide enough, the
absolutely positioned sidebar comes down over the top
of the footer. Unfortunately, we can’t fall back on the
clear property this time, because flowed elements
ignore the presence of absolutely positioned elements.
When the browser is wide, the
vertical space of the main
content area is reduced, and
the sidebar can come down over
the footer.
you are here 525