Я очень разбираюсь в CSS, но сегодня я наткнулся на фрагмент, который заставил меня поцарапать голову (здесь и здесь).
Я никогда не думал, что можно центрировать абсолютно позиционированный элемент через margin: 0 auto
, но данный элемент имеет заданную ширину и там left: 0
и right: 0
, он действительно работает:
#parent
{
background: #999;
height: 300px;
position: relative;
width: 300px;
}
#child
{
background: #333;
height: 50px;
left: 0;
margin: 0 auto;
position: absolute;
right: 0;
width: 50px;
}
<div id="parent">
<div id="child"></div>
</div>