我试图让我的内容 div 居中,但使用当前方法它是在右边而不是死在中心。
#content {
width: 620px;
height: 2000px;
position:absolute;
top: 300px;
left:50%;
margin-right: 310px;
background-color: #0F0;
padding: 0;
margin: 0px;
}
你应该使用margin: 0 auto;
宽度;那么它将位于其父项的中心。
只要你 div 有一个宽度:
#content {
width: 620px;
margin: 0 auto;
}
以绝对定位居中对象,
top:50%;
left:50%;
margin-top:-1000px; /* half of size */
margin-left:-310px; /* half of size */
就那么简单!
**绝对是最后的手段,通常在相对位置元素中使用。小心,如果您遇到绝对“divitis”的情况(对所有内容使用 div 并将它们定位为 absolute,因为您不熟悉最佳实践)
最好使用margin:auto
水平居中。
#content{
width: 620px;
Left: 50%;
margin-left: -310px;
}
你想使用 -50% 的总宽度#content
div
来移动它50%
——有点棘手:)
首先,您不应该将其position: absolute;
用于此目的。
您只需要定义一个宽度,然后用于margin: 0 auto;
使 div 居中。
例如...
#content {
width: 960px;
margin: 0 auto;
}
这是一个 JSFiddle... http://jsfiddle.net/cD6pe/