浮动元素，全宽

我有一个固定的大小布局，我居中内容容器。浮动元素，全宽

我希望菜单（主页，关于，联系人，登录）跨越屏幕的全部百分比。

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

回答