Bootstrap和col的1像素高度 - 为什么？

Question

有人能解释一下为什么 BS 默认设置了 1px 的高度吗？这在 2 和 3 中都是这样的，我从来没有明白过为什么。我知道注释中说“当为空时防止列坍塌”，但是会影响哪些浏览器呢？

- Chad J Treadway

Answer 1

尝试一下，你就会知道：http://bootply.com/82722

<div class="container" style="background-color:orange;">
    <div class="row">
    <div class="col-sm-6" style="background-color:blue;"></div>
    <div class="col-sm-6" style="background-color:red;">right</div>
    </div>
</div>
<div class="container" style="background-color:orange;">
    <div class="row">
    <div class="col-sm-6" style="background-color:blue;min-height:0"></div>
    <div class="col-sm-6" style="background-color:red;">right</div>
    </div>
</div>

- Bass Jobsen

---

那很有道理！谢谢！ - Chad J Treadway

在Chrome、Firefox和Safari（mac）以及IE 11（PC）上进行的一些测试表明，我们可以将其更改为0.1px，列仍然不会发生折叠...需要在移动/平板设备上进行测试，但如果1px高度引起问题，则可能是一个解决方案。 - MarkP

Answer 2

// Prevent columns from collapsing when empty
min-height: 1px;

来源：http://getbootstrap.com/css/#grid

- Daniel Dewhurst