22

Mac 上的 Bootstrap 4 和 Safari 浏览器存在问题。在一行内使用 cols 时,它会破坏它,并且不像在 Firefox 或 chrome 上那样工作。我正在使用这样的简单代码:

<div class="row align-items-center">
    <div class="col-sm-12 col-md-3 hidden-xs align_left"><h3>TEXT</h3></div>
    <div class="col-sm-4 col-md-3">TEXT</div>
    <div class="col-sm-4 col-md-3">TEXT</div>
    <div class="col-sm-4 col-md-3">TEXT</div>
</div>

我正在尝试与另一个问题不同的“修复代码”,但它们并没有解决问题。有什么线索吗?

提前致谢

4

2 回答 2

61

终于用这个简单的 CSS 解决了这个问题:

.row:before, .row:after {display: none !important;}

行内的 :before 和 :after 元素中似乎隐藏了一些代码。这会导致 Safari 浏览器出现某种问题。

希望能帮助到你。

于 2018-03-21T10:09:35.470 回答
9
.row:before, .row:after {width:0px; height:0px;}

显示的原因是:行前后的表格。通过使用 display:none,行将不会根据其中的元素保留其高度,并且行高现在为 0px,因为里面的列是浮动的。

于 2018-10-31T12:28:14.413 回答