html - 语义 UI 网格列高度

Question

我正在构建一个简单的基于网格的布局，我想将 .vertical pointing menu 放在第 3 个紫色行内，如图所示 fiddle .使第 3 行的高度占据视口(viewport)的 100% 的正确方法是什么？我尝试将正文和指向菜单的高度设置为 100%，但这没有用。该行的高度由内容的高度决定，在本例中为菜单的高度。

Answer 1

以下代码片段(和 jsfiddle)摘自 Semantic-UI Issues页面，同一用户在其中提出了相同的问题:

<style>
    html, body {
        height: 100%;
    }

    .ui.grid {
        height: 100%;
    }
</style>

<div class="ui padded equal height grid">
  <div class="two wide purple column">
  </div>
  <div class="fourteen wide stretched column">
    <div class="ui equal height grid">
      <div class="sixteen wide red column"></div>
      <div class="eight wide orange column"></div>
      <div class="eight wide blue column"></div>
    </div>
  </div>
</div>

http://jsfiddle.net/ea04tkwo/