视口缩小时，宽度百分比仍为包装的Div

Question

http://jsfiddle.net/rExDY/

如果结果面板足够宽，则页面的行为符合我的要求，左侧为导航，右侧为内容。当视口缩小时，我想要发生的事情是，一旦内容击中导航，内容就会缩小，而不是在其下方包裹。我一直在玩最小宽度，似乎无法让它做我想做的事。

Answer 1

您将内容宽度设置为90％。如果视口太小以至于<nav>框不适合宽度的剩余10％，那么内容将包含在其下方。如果将内容宽度减小到80％，您会发现它的行为要好得多，但是编写它的正确方法是为窗口左侧的<nav>元素保留绝对宽度列。

Answer 2

您可能想要尝试table-cell属性（仅限IE8及以上版本），并为IE7及以下版本添加一个回退（例如，对于nav已修复）：

demo

Answer 3

为什么不尝试使用类似的东西

http://jsfiddle.net/rExDY/27/

除非屏幕非常小，否则导航和内容不会重叠。如果导航达到一定的宽度，你可以使用一些CSS3来移动导航。