HTML and CSS Reference
In-Depth Information
A quick test drive
We've already said there might be a few
problems with this method of floating
the content to the left. Do a quick test
drive before you move on just to see how
this is all working. Go ahead and make
the changes to your “starbuzz.css” file
and then reload “index.html” in your
browser. Get a good feel for how the page
performs when it is resized to narrow,
normal, and wide.
Actually, thi
s looks pretty goo
d, and we
have the <di
v>s in the right o
rder now. But
it's not grea
t that the sideba
r expands;
it looks a lot
better fixed. S
idebars are
often used f
or navigation, and
they don't
look very go
od when expanded
.
When we float the sidebar <div> ri
ght,
then the design stays nice and tight
,
allowing the content to expand, but
if we
float the main content to the left
, the
design feels too loose, allowing the s
idebar
to expand.
Design-wise, the first design worked better, while information-wise, the
second works better (because of the placement of the <div>s). Is there
a way we can have the best of both worlds: have the sidebar at a fixed
width, but the main <div> still first in the HTML? What design tradeoffs
could we make to get there?
