如何使Bootstrap列都具有相同的高度？

本文翻译自：How can I make Bootstrap columns all the same height?

I'm using Bootstrap. 我正在使用Bootstrap。 How can I make three columns all the same height? 如何使三根柱子的高度相同？

Here is a screenshot of the problem. 这是问题的屏幕截图。 I would like the blue and red columns to be the same height as the yellow column. 我希望蓝色和红色列与黄色列的高度相同。

Here is the code: 这是代码：

 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> <div class="container-fluid"> <div class="row"> <div class="col-xs-4 panel" style="background-color: red"> some content </div> <div class="col-xs-4 panel" style="background-color: yellow"> catz <img width="100" height="100" src="https://lorempixel.com/100/100/cats/"> </div> <div class="col-xs-4 panel" style="background-color: blue"> some more content </div> </div> </div> 

---

#1楼

参考：https://stackoom.com/question/1Kdlw/如何使Bootstrap列都具有相同的高度

---

#2楼

Solution 4 using Bootstrap 4 使用Bootstrap 4的解决方案4

Bootstrap 4 uses Flexbox so there's need for extra CSS. Bootstrap 4使用Flexbox，因此需要额外的CSS。

Demo 演示版

<div class="container">