位置中心水平和垂直

我想中心一個彈出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

位置中心水平和垂直

回答

相關問題