make nav bar in header without absolute position

Question

I am not sure how to have the nav bar inside the header its gone outside of the box and now has no background color. I had it position absolute before and it worked but I am trying to find another alternative.I want the logo to also overlap the nav and the nav stretch out to the full width of the header

It is turning up in my browser like this

it looks different in the JS fiddle here is my code: http://jsfiddle.net/9nspQ/

HTML

<header>
<img src="../assets/images/logo.png" alt="">
<nav>
<ul>
 <li><a href="#">Tours &amp; Prices</a></li>
 <li><a href="#">Standard Flights</a></li>
 <li><a href="#">Meet the Staff</a></li>
 <li><a href="#">Charters</a></li>
</ul>
</nav>
</header>

CSS

header {
height: 100px;
background-color: #001D5D;
}

nav {
right:0;
bottom:0;
padding:10px;
background-color:#1CCEAE;
}

nav ul {
margin-left: 500px;
}

nav li {
display: inline-block;
margin-right: 20px;
}

nav li a {
text-decoration: none;
font-size: 1em;
color:white;    
}

Answer 1

Just FYI: right:0;bottom:0; have no effect if there is no position assigned

You have many elements that I am not too sure what they are for. I assume you have more code that you're dealing with on your application.

Try this:

.container {
    width: 960px;
    margin:0 auto;
    background-color: blue;
}
#logo{
    height:100px;
    width:100px;
    z-index:10;
    top:10px;
    position:absolute;
}
header {
    padding-top:50px;
    height: 70px;
    background-color: #001D5D;
}
nav {
    width:960px;
    padding:10px 0 10px;
    text-align:right;
    background-color:#1CCEAE;    
}
nav li {
    display: inline-block;
}
nav li a {
    text-decoration: none;
    font-size: 1em;
    color:white;    
}

DEMO

HERE IS THE WAY I WOULD DO IT:

   #logo{
    height:100px;
    width:100px;
    z-index:10;
    top:15px;
    left:30px;
    position:absolute;
}
header {
    width:100%;
    height: 80px;
    background-color: #001D5D;
}
ul {
    width: 100%;
    height:50px;
    line-height:50px;
    padding:0;
    margin:0;
    text-align:right;
    background-color:#1CCEAE;    
}
ul li {
    display: inline-block;
    padding-right:10px;
}
ul li a {
    text-decoration: none;
    font-size: 1em;
    color:white;    
}

DEMO