css - 用 Bootstrap 填充剩余高度

Question

我有一个网页。我的网页使用 Bootstrap 版本 3。目前，它看起来像这样:

<div class="row">
  <div class="col-lg-4">
    Stuff here
  </div>

  <div class="col-lg-8">
    Other stuff here
  </div>
</div>

<div class="row">
  <div class="col-lg-12">
    <div id="fillAvailableSpace">
      [Main content goes here]
    </div>
  </div>
</div>

<div class="row">
  <div class="col-lg-6">
    Other text goes here
  </div>

  <div class="col-lg-6 pull-right">
    Some text goes here
  </div>
</div>

我需要 ID 为“fillAvailableSpace”的 div 来填充屏幕的可用高度，第一行和最后一行的大小除外。如何使用 Bootstrap 填充页面的剩余可用高度？

Answer 1

尝试如下操作:

Element-name {
display: inline-flex;
height: 100%;
}