如何水平和垂直对齐固定位置的div？

Question

<div id="someid">some text here</div> 

三网融合

#someid{position: fixed; width: 500px; height: 30px;} 

我想定位绝对中心的水平和垂直窗口？

Answer 1

#someid{ 
position: 
fixed; 
width: 500px; 
height: 30px; 
right:50%; 
margin-right:-250px; 
} 

负边距用于修正浏览器在浏览器窗口右侧将div的右侧视为50％时出现的偏移量。

要垂直居中，您可能希望尝试与垂直位置相同的操作（这里没有保证，因为我以前没有这样做）。

例如：

top:50%; 
margin-top:-15px; 

编辑 一点更透彻的解释：当#someid置于50％从它被定位在正确的，以便它是其父总宽度的50％远离父母的右边界。然而，这并不是从#someid的中心到其父元素的右边界进行度量，而是从#someid的右边到其父元素的右边进行度量。当然，这并不是完全以#someid为中心，它仍然偏移了一半的宽度。

这就是为什么我们使用负边距来抵消它。负边距需要是＃someid宽度的一半，以弥补左边的偏移量，当我们将右边距它的父元素右边50％放置它时发生左边偏移量。

Answer 2

虽然你的位置是fixed你不能相对定位div。您必须通过javascript计算顶部和左侧值。您可以通过编写此水平居中的位置：

width: #SOMEWIDTH#px; 
margin: 0 auto; 

为了使边际位置的DIV的宽度属性必须设置中心。 自动边距不会影响垂直位置。