HTML and CSS Reference
In-Depth Information
• We bring
#header
and
#footer
above the stack so they hide the fake
borders which are painted inside the wrapper (from bottom to top).
• This is the generated content we use to create the columns.
The case of IE 8:
The last rule is for IE 8. Without this, IE 8 would not paint
the generated content over the borders that escape the wrapper (at the top).
If this declaration is sandboxed via the “\9″ hack, it is because Gecko
browsers would make everything unclickable/unselectable.
Note:
these pseudo-classes are not supported by IE 6 and 7, so in these
browsers, there are no borders between the columns.
ings to consider
The third layout uses one
main
wrapper, but it would make more sense to
use a
inner
wrapper instead to hold only the columns. In case this route was
taken here, then it was only for those of you who are stuck with this type of
construct, but want to implement this solution for equal height columns.
When absolutely positioning elements inside a containing block with wide
columns like in the last two demos, remember that the reference is the
padding box, so
0
for
right
or
left
may not be the value you would want
to use.
