Как заставить мои плавающие <li>s расширяться, чтобы покрыть все <ul>?

Question

Я решил сделать свои навигационные ссылки стилизованными <ul>. Как я могу сделать так, чтобы ширина каждого <li> расширялась так, чтобы они покрывали все <ul>, то есть первый начинается с left:0, а последний заканчивается right:0?

Как это выглядит при более низких разрешениях, не важно. Красная граница - <ul>, синяя - окружающая <div>.

Это мой текущий код:

div.nav_container {
    width:960px;
}
ul.nav {
    position:relative;
    list-style:none;
    padding-bottom: 10px;
    width:100%;
    border:1px solid red;
}
ul.nav li {
    margin:0 10px; padding:0;
    text-align:center;
    position:relative;
    float:left;
    width:13%;
    background-color:white;
    border:1px solid black;
}

Answer 1

ul.nav li {
margin:0; padding:0;
text-align:center;
position:relative;
display: inline-block;
width: 158px;
background-color:white;
border:1px solid black;
}

Ширина навигационного контейнера (960px), деленная на количество элементов списка (6) = 160px минус 2px для границы (1px с каждой стороны) = li ширина 158px.