如何在没有父母的情况下居中DIV？

Question

我想把我的表格放在它所在的水平行的中心。我认为这就像

一样简单

#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/。我没有得到一些非常明显的东西，但我不知道它是什么。

Answer 1

这个不是很直观但是：尝试设置margin：0 auto;

    #control {
    margin:0 auto;
    }

Answer 2

实际上答案很简单。你需要将margin-left / right设置为auto ..就像这样：

#control {
        margin: 0 auto;
}

Answer 3

您是否尝试将#control div居中？ 试试这个

#control {
  position:relative;
  left: 50%;
  transform: translateX(-50%);
}