http://www.zhihu.com/question/21644198知乎网友回答
1. margin:auto 能使块级元素水平居中,计算公式如下
. ‘margin-left’(x) + ‘border-left-width’(0) + ‘padding-left’(0) + ‘width’(假设 300px) + ‘padding-right’(0) + ‘border-right-width’ (0)+ ‘margin-right’(x) = width of containing block(假设 600 px)
整理下
x+0+0+300+0+0+x = 600
求x
2x+300 = 600
2x = 300
x = 150 (px)
为何不能垂直居中……
这个主要是规范里没给这方面规定……
并与其他初始设定冲突。
如:
width 相关计算依赖于其包含块,这玩意是最初能确定值。
而 height 相关计算依赖于其自身内容高度,自身内容高度是不能最初确定值的。
所以无法建立类似上面的公式来使用 mt、mb auto 实现高度居中。
且,mt、mb 的百分比值参照还是依赖包含块实际宽度的。
同理,因为包含块高度未知,没办法以确定值来计算 mt、mb。
作者:貘吃馍香
链接:http://www.zhihu.com/question/21644198/answer/42702524
来源:知乎
著作权归作者所有,转载请联系作者获得授权。