我正在构建一个简单的基于网格的布局,我想将.vertical pointing menu
放在第3个紫色行中,如此处fiddle所示。哪个是使第3行的高度适合100%视口的正确方法?我尝试通过将主体和指向菜单高度设置为100%但没有任何效果。该行的高度由内容的高度决定,在本例中为菜单的高度。
答案 0 :(得分:10)
以下代码段(和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>