Flexbox不垂直对齐

时间:2014-12-01 21:47:37

标签: html css flexbox

我需要一些帮助垂直对齐下表。 我无法理解为什么它没有垂直对齐。

HTML:

<table>
    <tr>
        <td>Lorem Ipsum</td>
        <td>Lorem Ipsum</td>
    </tr>
    <tr>
        <td>Lorem Ipsum</td>
        <td>Lorem Ipsum</td>
    </tr>
</table>

CSS:

body {
    display: flex;
    justify-content: center;
    align-items: center;
}

Fiddle

1 个答案:

答案 0 :(得分:2)

您可以使用此样式修复它:

body, html {
  height: 100%;
}

如果没有这个,身体的高度只占据足够的空间来容纳其内容。

Fiddle