为什么我的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. 让正在消失的部分成为垂直居中的背景图像。

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