Как мне разместить 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;
}
Другие вопросы по тегам