使用Bootstrap 4進行​​垂直單元對齊

Question

我正在創建一個管理頁面，該查詢頁面隨后查詢站點關鍵頁面的頁面權重（着陸等）。

隨着Bootstrap 4的臨近，我用它來創建一個布局，對此我感到滿意。 但是，對於每一行，單元格中的文本不是垂直對齊的。 我可以使用以下方法進行簡單的右對齊：

.cell { text-align: right; }

但我也想垂直對齊。 我相信Bootstrap 4正在使用flexbox。 有什么方法可以使用flex在單元格中進行垂直文本對齊嗎？ 我的示例在CodePen上

Answer 1

它們已經對齊，在按鈕內填充使文本在第二列第一個不對齊。

在第二列文字中添加以下CSS：

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