如何在没有Bootstrap的情况下使用纯CSS将两个div中心化？

Question

所以我知道这可以使用Flexbox来实现，但特别是当使用非加载Bootstrap的非常轻量级的电子商务网站（如Shopify主题）时，有时我们只想坚持使用纯CSS。

如何使用CSS实现与此相同的效果？

<center>
  <table>
    <tr>
      <td>
        <div>
          <img ... />
          <br />
          <label ... />
        </div>
      </td>
      <td>
        <div>
          <img ... />
          <br />
          <label ... />
        </div>
      </td>
    </tr>
  </table>
</center>

（粗略的例子，但希望它得到了重点。）

Answer 1

您需要将div的margin设置为auto。这将把div放在父容器中。

div { 
  margin: 0 auto;
  width: 100px;
}