Question

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>

我正在尝试从另一个问题尝试不同的“修复代码”，但它们并没有解决问题。任何线索？

提前致谢

Answer 1

最后用这个简单的CSS解决了这个问题：

browser.expect

似乎隐藏了一些代码：before和：after行内的元素。这会在Safari浏览器中引起某些问题。

希望它有所帮助。

Answer 2

.row:before, .row:after {width:0px; height:0px;}

有一个原因进行显示：表在行之前和之后。通过使用display：none，行将不保留其高度，具体取决于行中的元素，并且行高度现在为0px，因为其中的列是浮动的。

Mac Grid上的Bootstrap 4 Safari问题

2 个答案: