如何在保護孩子的同時居中父母

嘿，我正在嘗試將旋轉器置於垂直居中的高度，因此它位於任何頁面的中間。如何在保護孩子的同時居中父母

<body>  
    <div class="spinner"> 
    <div class="double-bounce1"></div> 
    <div class="double-bounce2"></div> 
    </div> 
</body>

爲.spinner的風格在這裏：

.spinner { 
    width: 40px; 
    height: 40px; 

    position: relative; 
    margin: 100px auto; 
}

我試圖改變高度height:100vh;但它搞砸內的div。如何移動中心DIV頁面的中心，並保留我發現這裏的微調：http://tobiasahlin.com/spinkit/

來源

2014-08-29 Connor Leech

'position：absolute;'and center using that？ – Ruddy 2014-08-29 08:04:16

.spinner { 
    width: 40px; 
    height: 40px; 

    position: absolute; 
    top:50%; 
    left:50% 
}

嘗試使用絕對和頂部&留下了50％;它會把它們放在中心

來源

2014-08-29 08:12:36 himanshu

body{ 
    position: relative; 
} 

.spinner { 
    width: 40px; 
    height: 40px; 

    position: absolute; 
    top:50%; 
    left:50% 

    margin: -20px 0 0 -20px; 
}

隨着保證金：-20px 0 0 -20px;你會到達確切的中心。這是因爲，頂部：50％和left：50px將顯示從中心開始的元素。

來源

2014-08-29 08:17:50 deanpodgornik

我認爲這會對OP和其他訪問者更有幫助，當你在你的介紹中添加一些說明。 – reporter 2014-08-29 08:37:27

我剛剛通過解釋更新了帖子 – deanpodgornik 2014-08-29 09:01:59

如何在保護孩子的同時居中父母

回答

相關問題