Javascript 自举等列

我们被告知用这个来回答一个问题

以下是我们菜单的细目；我们为CSS/HTML/JS的形状道歉，但不知道如何以其他方式呈现它

我们正在尝试使所有列/行的高度相同。 我们知道行eq高度，但显然做得不对

代码如下：

完整剪辑：

Exerp：

<div class="row-eq-height">
      <div class="col-md-6 col-md-offset-3">
        <!-- Tab panes -->
        <div class="tab-content faq-cat-content">
          <div class="tab-pane active in fade" id="faq-cat-1">
            <div class="panel-group" id="accordion-cat-1">
              <div class="panel panel-default panel-faq">
                <div class="panel-heading">
                  <a data-parent="#accordion-cat-1" data-toggle="collapse" href="#faq-cat-1-sub-1">
                  <h4 class="panel-title">Sharable Appetizers <span><i class="glyphicon glyphicon-plus"></i></span>
                  <span><img src="images/menu-top-a.png" style="width:100%;"></span></h4></a>
                </div>
                <div class="panel-collapse collapse" id="faq-cat-1-sub-1">
                  <div class="panel-body">
                    <div class="row-eq-height form-group">

---

要确保所有子元素都具有相同的高度，请在父容器中使用

flex

，在您的情况下，将其添加到css中

.row-eq-height{
display:flex;
}

---

.row eq height

不是引导中的本机类。您需要在CSS中自己添加和定义它：

.row-eq-height {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display:         flex;
}

请注意：此类使用CSS3的flexbox布局模式，这在Internet Explorer 9及以下版本中不受支持。有关详细信息，请参阅