Här kommer ett väldigt snabbt men fungerande exempel:
HTML-kod:
<div class="wrapper">
<div class="head">Rubrik</div>
<div class="content">Content kommer här</div>
<div class="nav">
<ul>
<li><a href="#">Länk 1</a></li>
<li><a href="#">Länk 2</a></li>
</ul>
</div>
<div class="footer">Footer</div>
</div>
CSS:
Kod:
.wrapper {
width: 70%;
margin: 20px auto;
}
.head {
width: 100%;
height: 20px;
background: #ddd;
}
.content {
background: #333;
color: #fff;
float:left;
width: 70%;
}
.nav {
background: red;
float:left;
width: 30%;
}
.footer {
background: #000;
color: red;
clear: both;
}
Du får detta resultat: http://jsfiddle.net/9g2rp/
Men precis, sätt clear: both; på footern.