How to center a “position: absolute” element in IE 9, 10, 11, my example do not work in Internet Explorer. Also this "position: absolute; left:50%; margin-left:-20px;" ,manner will not suit me, as the layout is responsive.
.box{
position: absolute;
top: 150px;
right: 0;
left: 0;
margin: auto;
}
<body>
<div class="container">
<div class="box">
</div>
</div>
</body>
<body>
<div class="container">
<div class="box">
</div>
</div>
</body>
CSS
.box{
position: absolute;
top:0;
right: 0;
left: 0;
bottom:0; //specify all including bottom:0
margin: auto;
height:200px;
width:200px;
}
DEMO
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With