垂直边框被水平边框弄乱了 - 弹性框

Question

我用flexbox创建了一个表格。我想在中心添加一条垂直线，所以我为所有第一列添加了一条border-right，但是行底部的边框破坏了垂直线的视觉流。我很难弄清楚如何解决这个问题。如何在保持底部边框的同时添加垂直线？

JSFIDDLE： https://jsfiddle.net/oczxqxmu/

Answer 1

只需删除

.flex_row:not(:last-child) {
        border-bottom: 2px solid #fff;
}

喜欢这个https://jsfiddle.net/oczxqxmu/1/

如果要保留底部边框，请使用 ：：after 和 position：absolute 在表格中间创建一条线，如下所示

https://jsfiddle.net/oczxqxmu/11/