使用均衡器

Question

我使用基础（5）来布局我的网格。 Foundation使用均衡器使您能够相互测量列。我使用它效果很好，但它只能让我到目前为止......

当我嵌入我的行时，我得到了一个间隙 - 我真的需要在报价框上有一个灵活的高度来填补空白（见图）。我已经尝试使用JS来匹配容器的均衡值的高度，但它只是在调整窗口大小时不断增长框。

有没有人对如何以流畅的响应方式扩展div的高度有任何建议，以便它的（绝对定位的）内容随之增长？

<!-- START Tier One -->
<div class="row" data-equalizer="foo" data-equalizer-mq="large-up">

  <div class="large-4 large-push-8 medium-12 medium-push-12 small-12 columns" data-equalizer-watch="foo">
    <div class="row" data-equalizer="tierOne" data-equalizer-mq="medium-only">
      <div class="large-12 medium-6 small-12 columns">
        <!-- Video -->
      </div>
      <div class="large-12 medium-6 small-12 columns case-study-col">

        <div class="card show-for-medium-up case-study-parent" data-equalizer-watch="tierOne">
          <a href="/case-studies/">
            <div class="card__case-study case-study-child">
              <div class="card__case-study-img" style="background-image:url('img/image.jpg');">
              </div>
              <div class="card__case-study-content">
                <blockquote class="">
                  "<perch:content id="quote_featured" type="textarea" />"
                  <cite>
                          <perch:if exists="quote_avatar_featured">
                            <img src="img/avatar.jpg">
                          </perch:if>
                          <div class="q-cite">
                          </div>
                  </cite>
                </blockquote>

              </div>
              <div class="card__case-study-bg">
              </div>
            </div>
          </a>
        </div>

      </div>
    </div>
  </div>

  <div class="large-8 large-pull-4 medium-12 medium-pull-12 small-12 columns" data-equalizer-watch="foo">



    <div class="card">
      <div class="row collapse">

        <div class="large-12 medium-6 small-12 columns">
          <div class="row collapse">
            <div class="large-5 medium-12 small-12 columns">
              <!-- news image -->
            </div>
            <div class="large-7 medium-12 small-12 columns">
              <!-- news text -->
            </div>
          </div>
        </div>

      </div>
    </div>



  </div>

</div>
<!-- END Teir One -->