HTML and CSS Reference
In-Depth Information
Move the elixirs <div> back to its original
place below the main recommendations,
then save and reload the page. Where
does the element get floated now?
You should see the elixirs below the
main content and beside the music
recommendations and the footer.
The <di
v> is floated
to the
right, just
below t
he main
content
, and the
remaind
er of the
HTML
is floated
around
it (which is the
music re
commendations
and the
footer).
What we want to do is set a right margin on the main content section so that
it's the same width as the sidebar. But how big is the sidebar? Well, we hope
you aren't already rusty since the last chapter. Here's all the information you
need to compute the width of the sidebar. And here's the solution.
#sidebar {
background: #efe5d0 url(images/background.gif) bottom right;
font-size: 105%;
padding: 15px;
margin: 0px 10px 10px 10px;
width: 280px;
float: right;
}
15 + 15 + 280 + 0 + 0 + 10 + 10 = 330