Another problem regarding hor. navs

I am still learning the basics of css and I've run into another (small) problem.

Right now I have a simple layout (over here).

As you can see the navigation looks unfinished.

What I wanted to do was a bar with the same width as the header with borders around it (except for the top) and then the navigation put onto it.
Now I am trying to create this bar, but it just won't show up...

This is the relevant code...

#nav {
width: 698px;
margin: auto;
height: auto;
background-color: C0FFA4;
}

#navigation {
margin: 0;
padding: 0;
list-style-type: none;
}

#navigation li {
float: left;
}

#navigation a {
background-color: #C0FFA4;
text-decoration: none;
color: #5A784D;
display: block;
width: 90px;
text-align: center;
border-bottom: 5px solid #5A784D;
border-right: 1px solid #5A784D;
padding-top: 5px;
padding-bottom: 5px;
}

#navigation a:hover {
background-color: #91FF69;
color: #203817;
border-bottom: 5px solid #203817;
}

Code (markup):

html:

<div id="nav">
<ul id="navigation">
	<li><a href="#">Home</a></li>
	<li><a href="#">About</a></li>
	<li><a href="#">Link</a></li>
	<li><a href="#">Link 2</a></li>
	<li><a href="#">Link 3</a></li>
</ul>
</div>

Code (markup):

This is how it should look:
http://img510.imageshack.us/img510/5027/goodgn1.gif

 

Your link, http://supreme-csm.com/silverblade/learning - gives me a page not found

 

Oh, I apologize, but I've removed it since it's already fixed