为什么我的div在调整大小时会在左侧停止

Question

我之前学到了一些有趣的东西，并尝试用它来玩，但是我注意到了之前从未注意过的东西。

当我在我的div宽度上调整窗口大小时，它不会均匀地隐藏我的div，而是停在左边并开始向右隐藏。

经过一些研究后，我发现不同的答案，如给定位会导致这样的事情，但考虑到我的代码是多么基本似乎不是原因......

这是我的代码：http://jsfiddle.net/L9Srn/5/

<div id="container"></div>
#container {
    background: red;
    margin: auto;
}
var box= $('#container'),
    ratio= 0.363,
    height= 400;

box.height(height).width(height*ratio);

Answer 1

这就是浏览器/ CSS的工作方式。当元素太宽而无法放入窗口时，它们会在左侧停止并向右溢出。

在我的头顶，调整大小时隐藏在浏览器窗口左侧的东西的唯一方法是：

1. 绝对定位
2. 固定定位
3. 负利润
4. 负填充
5. 使正在消失的部分成为垂直居中的背景图像。

即使你使用这些方法，你也无法向左滚动以查看被截断的内容。