位置中心水平和垂直

我想中心一个弹出div如何可以做浏览器友好？位置中心水平和垂直

这是原来的一点左边。

<div class="popLayerWrapper"> 
    <div id="addBookmarksLayer" class="popLayer" style="left:260px; padding:30px;"> 
     <div class="closeLayer" >close</div> 
     <div class="layerContent"></div> 
    </div> 
</div>

来源

2010-04-28 loo

不知道我理解你想中心，该中心的一部分，但假设整个事情：

.popLayerWrapper { 
    position: absolute; 
    width: 40%; /* could be anything */ 
    left: 50%; 
    margin-left: -20%; /* half of width */ 
    height: 40%; /* again, could be anything */ 
    top: 50%; 
    margin-top: -20%; /* half of height */ 
}

来源

2010-04-28 01:14:14

谢谢！位置顶部不在铬 – loo 2010-04-28 01:33:49

，以确保它在顶部，你可能想要把这样的东西： z-index：10;也在那里 – 2010-04-29 12:55:38

我使用此代码窗口视口的中心到中心的元素：

html { 
    display: table; 
    table-layout: fixed; 
    width: 100%; 
    height: 100%; 
} 

body { 
    display: table-cell; 
    width: 100%; 
    height: 100%; 
    vertical-align: middle; 
    margin:0; 
} 

#center { 
    margin: auto; 
}

您可以在此链接找到完整的示例（Bredele CSS bundle）。我认为它应该适用于你的弹出窗口。

奥利维尔

来源

2013-01-20 18:36:25 Bredele

位置中心水平和垂直

回答

相关问题