Layout with CSS3 - HTML5 and CSS3 - page 273

header, section, aside, footer {
margin: 2%;
padding: 2%;
outline: 4px dashed black;
vertical-align: top;
}
section, aside {
display: inline-block;
width: 54.5%;
}
aside {
margin-right: 0;
width: 28.5%;
}

Full Partial

1.0 -

3.0 2.0

8.0 6.0

9.0 -

3.1 -

inline-bloc k solves several issues
that afflict float s. The first benefit of
inline-block over floats is that the
elements aren't removed from the
normal document flow. This means
that in a basic two-column layout, it
doesn't matter which of the columns
is the longest. Any full-width ele-
ment will automatically be pushed
below both columns—no clearing is
required.