Как мне разместить DIV без родителей?
Я хочу центрировать мою форму в центре горизонтального ряда, в котором она находится. Я думал, что это будет так же просто, как
#control {
text-align: center;
}
Элемент, который я хочу центрировать
<div id="control" class="btn">
<div id="btn_container"><img width="100" height="100" src="https://cdn3.iconfinder.com/data/icons/minecraft-icons/512/Stone_Pickaxe.png" alt="Mining pick" /></div>
<span>Start</span>
</div>
Тем не менее, элемент по-прежнему не центрирован - https://jsfiddle.net/xwdnvcy5/58/. Я не вижу чего-то действительно очевидного, но я не могу сказать, что это такое.
3 ответа
Решение
Это не очень интуитивно понятно, но: попробуйте установить поле:0 авто;
#control {
margin:0 auto;
}
Вы пытаетесь центрировать #control div? Попробуй это
#control {
position:relative;
left: 50%;
transform: translateX(-50%);
}
Ответ довольно прост на самом деле. Вам нужно установить поле слева-справа как auto
.. как это:
#control {
margin: 0 auto;
}