在这个JSFiddle中
div的保证金最高可达50%.我希望调整到页面高度.
但是,如果您在Firefox(3& 4)中调整窗口大小,您将看到div的垂直位置受页面宽度的影响,但不受页面高度的影响.
为什么?
解决方法
它看起来似乎是违反直觉的,但实际上是根据边距的盒子模型,其中指出,in the CSS level 2.1 spec:
The percentage is calculated with respect to the width of the generated Box’s containing block. Note that this is true for ‘margin-top’ and ‘margin-bottom’ as well. If the containing block’s width depends on this element,then the resulting layout is undefined in CSS 2.1.
和in the CSS3 spec(更清楚的IMO):
Note that in a horizontal flow,percentages on ‘margin-top’ and ‘margin-bottom’ are relative to the width of the containing block,not the height (and in vertical flow,‘margin-left’ and ‘margin-right’ are relative to the height,not the width).
(大胆强调我的.)