Bootstrap：如何获得具有 100% 高度的另一列的列

Posted 2023-03-06

【中文标题】Bootstrap：如何获得具有 100% 高度的另一列的列

【英文标题】：Bootstrap: How to get a column with 100% the height of another column

【发布时间】：2013-08-03 22:17:24

【问题描述】：

我有这种结构： （这是 bootstrap 3 但它应该与版本 2.x 相同）

很基本的东西，看起来像一张桌子。我希望右侧的 col-lg-4 与左侧的 col-lg-8 具有相同的大小。我试过 style="min-height: 100%" （这显然没有用，因为我在这里问）。我一直在做一些研究，但大多数提出相同问题的人都希望他们的全部内容是 100% 的页面。我希望这是同一行中左侧 div 的 100%。我什至不明白为什么它不起作用，100% 应该适用于外行的高度，这是我需要的确切高度（外行没有填充，图像看起来像这样以获得更好的概览网格）

【问题讨论】：

我不是专家，但可能正在使用偏移量？

你能发一个FIDDLE

检查接受的答案@***.com/questions/9143971/…

【参考方案1】：

如果您熟悉 jQuery...这在过去对我有用。只需将列组传递给此函数即可。

function equalHeight(group) 
   tallest = 0;
   group.each(function() 
       thisHeight = $(this).height();
       if(thisHeight > tallest) 
          tallest = thisHeight;
       
   );
   group.height(tallest);

这样使用...

$(document).ready(function()
    equalHeight($('.cols'));
);