Question

我只是在学习bootstrap 4.这些列应该是相同的高度，但是没有用。代码：

<div class="row">
   <div class="col-xs-8 col-sm-8 col-md-8 col-lg-8 col-xl-8">
     <div class="projectDescBox">
       <h5>Project</h5>
       <p>Stuff here</p>
     </div>
   </div>
   <div class="col-xs-4 col-sm-4 col-md-4 col-lg-4 col-xl-4">
     <div class="projectDescBox">
       <h5>heading</h5>
       <p>a lot longer stuff here. This box should be a lot longer.a lot longer stuff here. This box should be a lot longer.a lot longer stuff here. This box should be a lot longer.</p>
    </div>
  </div>

（它在一个类容器中进一步向上）。根据文档，它应该自动高度相同。但是，这是我的输出： screenshot

我错过了什么？谢谢！

Answer 1

你的列很可能是相同的高度。这不是open()。使用 projectDescBox 类（h-100）使内框填充高度。

height:100%

https://www.codeply.com/go/d8lGpPzUOy

此外，<div class="projectDescBox h-100"> <h5>heading</h5> <p>a lot longer stuff here. This box should be a lot longer.a lot longer stuff here. This box should be a lot longer.a lot longer stuff here. This box should be a lot longer.</p> </div>已在Bootstrap 4中替换为col-xs-*。多层类也是不必要的，因为每层的宽度都相同。

这个： col-*，

与： col-8 col-sm-8 col-md-8 col-lg-8 col-xl-8

相同

当您希望每层的宽度不同时，您只需要拥有多层类（例如：col-8）

为什么我的bootstrap 4列不是同一个高度？

1 个答案: