css - 我怎样才能将我的导航 div 的高度设置为它包含标题 div 的高度的 100%？

Question

如何将导航 div 的高度设置为其包含标题 div 的高度的 100%。根据 CMS，我使用的布局是这样的。

<header>
    <div class=“container”>
        <nav class=“nav-primary collapse navbar-collapse”>

其中一些类来自 bootstrap。页眉高度明确设置为 80px。容器 div 没有高度属性。 nav css 具有 height 属性作为 auto !important。 CSS在下面。

我需要导航为 100%。我已经检查了这里关于堆栈溢出的其他帖子，但没有发现任何类似这种情况的东西。

html, body {
  height:100%;
}

header {
  position: fixed;
  width: 100%;
  z-index: 999;
  min-height:80px;

.nav-collapse {
    display: block !important; 
    height: auto !important; 
    padding-bottom: 0; 
    overflow: visible !important;
}

Answer 1

您可以将此 css 添加到您的 .container 中:

.container {
    position: absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
}

Jsfiddle:https://jsfiddle.net/z4sjjto6/