css - 试图将 2 个响应表置于页面中心

Question

出于某种原因，这 2 个表不会居中，我尝试了引导容器类，尝试了 margin 0 auto。但是他们不会集中在中间，知道吗？

我希望两个表格居中并在中间水平并排显示。

它在 codepen 上: enter link description here http://codepen.io/Satearn/pen/ybvXLR

  .z
 {position :absolute ;
 top:50%;
 left:50%;
  transform :translate(-50%,-50%) ;}

Answer 1

要使它们居中对齐，只需删除 width: 100%;来自您的以下 CSS 代码。

.table-fill {
    background: white;
    border-radius:3px;
    border-collapse: collapse;
    height: 320px;
    margin: auto;
    max-width: 300px;
    padding:5px;
    width: 100%;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    animation: float 5s infinite;
  }