浮動元素，全寬

我有一個固定的大小布局，我居中內容容器。浮動元素，全寬

我希望菜單（主頁，關於，聯繫人，登錄）跨越屏幕的全部百分比。

enter image description here

我想結果是這樣的： enter image description here

我已經嘗試了使用菜單，其中100％的寬度容器我會在裏面有一個容器來居中菜單，但它不能很好地工作，因爲那時的佈局是相對的，隨窗口大小而改變。

2012-04-21 Ragnar123

裹額外的div角落找尋菜單，給它灰色的背景，刪除多餘的填充，使菜單BG白：

這是有問題的，當我們想以保持菜單和右欄之間的空間「開放」。

最簡單的方法，可能是最好的是有一個模擬圖像的中間是「打開」，並將其用作背景。由於這種類型的png圖片是出奇的小，它比多標記，CSS或一個js更好的解決方案，再加上如果正確使用它沒有怪癖：

您也表明你的實際發展論壇網站;如果你想爲菜單實現這個功能，由於圖層中使用的不透明類型，你將不得不使菜單的高度固定（否則，其寬度仍然可以是流暢的）。可以使用相同的背景技巧來處理它。

2012-04-21 21:55:07 sg3s

如果背景不只是白色？像這樣：http://jsfiddle.net/Hxhc5/5/？ – Ragnar123 2012-04-21 22:00:16

@ Ragnar123肯定會讓事情複雜化，從一開始就會很高興知道;） – sg3s 2012-04-21 22:02:40

哦，對不起。我的猜測是，這並不重要。 – Ragnar123 2012-04-21 22:04:34

爲什麼不使用橫跨整個頁面的背景圖像呢？

2012-04-21 21:52:35

我已經爲我的網站使用了一個背景圖片，我不覺得它適合使用背景，我絕對將其鎖定在高度。 – Ragnar123 2012-04-21 22:05:59

只需將菜單的內容添加到另一個div中，使用width: 500px, margin: auto;並將菜單寬度設置爲100％。這裏被更新的jsfiddle：http://jsfiddle.net/Hxhc5/2/

2012-04-21 21:52:59 gabitzish

菜單間的空間如何？可能在那裏保留白色背景= – Ragnar123 2012-04-21 21:55:16

@gabitzish寬度不需要100％，自動調整尺寸會照顧到這一點，並且更加乾淨。 – sg3s 2012-04-21 21:57:07

將background-color：#fff添加到插入的div：http://jsfiddle.net/Hxhc5/4/ – gabitzish 2012-04-21 21:57:21

回答