CSS垂直和水平居中在視口中的元素，使其響應跨瀏覽器

CSS使格中心的水平和垂直CSS垂直和水平居中在視口中的元素，使其響應跨瀏覽器

.centerd-element 
{ 
    top: 0; left: 0; bottom: 0; right: 0; 
    position:absolute; 
    margin:auto; 
    background-color:#FFFFFF; 
    z-index:150; 
    /*max-width and max-height should be dynamic*/ 
    max-width:500px; 
    max-height:200px; 
}

這除了IE8所有主流瀏覽器工作正常，在IE8的元素是stucked到視口的頂部。

我如何使它在ie8中工作。

來源

2015-05-20 Abdul Basit

您是否嘗試過的解決方案之一這裏提出：http://howtocenterincss.com/？ – pinturic

max-widths如何動態變化？你的意思是寬度應該是動態的，但有限？ –

@Paulie_D基本上max-width和max-height應該是內聯的並且由javascript設置，但我無法使用javascript來對齊元素。 –

這應該在所有的瀏覽器：

.centerd-element { 
    position:absolute; 
    display:inline-block; 
    background-color:black; 

    top:50%; 
    left:50%; 
    height:200px; 
    width:500px; 
    margin:-100px -250px; 
}

來源

2015-05-20 13:10:53

這是一個硬性值的大小......我相信OP想要動態寬度。 –

我錯過了...但我不認爲這是可能的跨瀏覽器。我希望有人證明我錯了 –

寬度和高度應該是動態的 –

CSS垂直和水平居中在視口中的元素，使其響應跨瀏覽器

回答

相關問題