html - 使用 Bootstrap 4 进行垂直单元格对齐

Question

我正在创建一个管理页面，用于查询然后报告网站关键页面(登陆等)的页面权重

由于 Bootstrap 4 已接近尾声，我已使用它创建了一个布局，对此我很满意。但是对于每一行，单元格中的文本不是垂直对齐的。我可以做一个简单的右对齐:

.cell { text-align: right; }

但我也想垂直对齐。我相信 Bootstrap 4 使用的是 flexbox。有什么方法可以使用 flex 在单元格中进行垂直文本对齐吗？我的例子在 CodePen 上

Answer 1

它们已经对齐了，按钮内部的填充使文本在第二列 w.r.t. 上不对齐。首先。

将以下 css 添加到第二列文本:

padding: .375rem 0;
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
vertical-align: middle;