如何讓divs填充剩餘空間？

Question

我知道有類似的問題，但我找不到要做什麼。 這是一張圖片，顯示我想要做什麼。

http://s7.postimg.org/6wkq6376j/Question.jpg

可以在一個div容器3周的div是一個很好的選擇嗎？我想將橫幅和導航欄放在中心，大小與所示相同。

如何填充剩餘空間，使其看起來像我的導航欄是100％寬度？

*（我試過100％，導航欄的按鈕變得太大了）。

Answer 1

如果我理解正確.. 1）把它們放在一個全寬的包裝div中。 2）然後給橫幅和導航自己設置寬度和「邊距：0自動;」把它漂浮在中心。 3）然後，您可以在導航包裝上設置BG圖像以匹配導航欄，因此它一直延伸，但導航欄保持固定寬度並居中。

類似下面，這裏是一個小提琴更容易看到它：http://jsfiddle.net/s_Oaten/GTDBX/

HTML

<div class="header_wrap"> 
    <div class="banner"></div> 
    <div class="nav_wrap"> 
    <div class="nav"> 
     <ul><li>Link</li><li>Link</li><li>Link</li><li>Link</li><li>Link</li></ul> 
    </div> 
    </div> 

CSS

.header_wrap { 
    height: 110px; 
    margin: o auto; 
    background: #0000dd; 
} 
.nav_wrap { 
    height: 80px; 
    margin: o auto; 
    background: #707070; 
} 
.banner { 
    height:110px; 
    background: blue; 
    margin: 0 auto; 
    width: 600px; 
} 
.nav { 
    height: 80px; 
    background: grey; 
    margin: 0 auto; 
    width: 600px; 
} 
ul {margin: 0; padding: 0;} 
.nav li { 
    display: block; 
    float: left; 
    width: 20%; 
    list-style: none; 
    text-align: center; 
}