CSS中心技巧

我最喜欢的仅使用CSS来居中xhtml元素的等式如下:

display: block;
position: absolute;
width: _insert width here_;
left: 50%;
margin-left: _insert width divided by two & multiplied by negative one here_

还有更简单的边距:支持它的浏览器中的自动方法.有没有其他人有强大的方法来强制内容显示在其容器中心？(垂直居中的奖励积分)

编辑 - 哎呀,忘了边缘左边的'负面'部分.固定.

div #centered{
 margin: 0 auto;
}

从我的经验来看似乎是最可靠的.

坚持保证金:0自动; 用于水平对齐; 如果你需要垂直对齐以及使用position:absolute; 最高:50%; margin-top: - (width/2)px; 但要注意,如果您的容器的宽度大于屏幕的宽度,则部分容器将使用Position:absolute方法从左侧的屏幕上掉落.

好吧,这似乎是大规模的矫枉过正,我必须说.对于现代浏览器,我倾向于将容器设置text-align:center;为旧浏览margin:auto;器,并保留它.然后在元素中重置text-align(如果它包含文本).

当然,有些东西需要设置为块,宽度需要设置......但是你究竟想要什么样的风格需要那么多的黑客攻击？