如何使用像素和百分比设置2个div的宽度

Question

我有这个例子here。

我希望您按照以下步骤操作：

• 将浏览器窗口调整为小于950像素宽。
• 现在使用水平滚动条向右滚动。
• 现在您会注意到灰色条（div）停止并​​且不会继续到页面的右边缘。

我想知道如何修复它，以便灰色条在整个页面上继续。

Answer 1

不使用css来设置bgcolor和border，而是使用1px宽的图像，无论你需要多高，都需要它。

`background:url('images/bg.gif') repeat-x;`

请确保在bg图片中包含1px底部边框。

Answer 2

在栏上使用min-width，其宽度与其中的内容相同......

我不知道您想要什么样的跨浏览器兼容性，但这应该适用于IE7＆gt; 。任何更多会使这更复杂。

此处示例：

http://jsfiddle.net/sg3s/hrN5F/

编辑，这也可能解决了旧版IE的问题，但无法测试http://jsfiddle.net/sg3s/hrN5F/2/