Scusate se la domanda può sembrar stupida ma sto cercando di imparare...

Io dovrei semplicemente creare un menù ( tramite una lista UL e LI ) all'interno di un DIV. Il fatto è che questo menù lo vorrei in orizzontale ( e ok, usando float:left ) ma lo vorrei a sinistra e in basso del div!
Non riesco proprio a farlo... mi date una mano? Io vorrei una cosa del genere...

http://s8.postimg.org/acstyq1fp/div.jpg

ecco il codice scritto da me:

NELL' HTML
<body>
<header>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Contatti</a></li>
</ul>
</nav>
</header>
<main>
</main>
<footer>
</footer>
</body>
</html>

MENTRE NEL CSS :

body {
position:relative;
margin:2px auto;
width:60em;
}


header{
width:60em;
position:relative;}




header, main, footer{
border:1px solid red;
display:block;}


nav {
background-color:#999;
height:9.38em;
width:60em;
}


footer{
height:9.38em;}

main{
background-color:#933;
width:60em;
height:37.50em;
border:1px solid black;}


body > header{
border: 0;
border-bottom: #09C;
margin: 1px auto;
position: relative;
background-color: #0066FF;
}

nav{display:block;
border-top:3px #000000;
}


nav ul{height:28px;
margin:1px auto;
width:10.2em;
white-space:nowrap;
list-style:none outside none;}



nav ul li {
float:left;
text-align:right;}


Grazie ...