如何在容器中垂直居中行?

新手上路,请多包涵

默认情况下,该行与顶部对齐。

我试着把 margin-top: auto;和底部边距:自动;但不起作用。还有垂直对齐:中间;也不起作用。

有一个简单的解决方法吗?

谢谢

 .container {
background-color:black;
height: 100px;
}

.row {
background-color:#fff;
height: 50px;
}
 <div class="container">
  <div class="row">
  </div>
</div>

原文由 suonpera 发布,翻译遵循 CC BY-SA 4.0 许可协议

阅读 185
1 个回答

您可以为此使用 flexbox

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

原文由 Super User 发布,翻译遵循 CC BY-SA 4.0 许可协议

推荐问题
logo
Stack Overflow 翻译
子站问答
访问
宣传栏