Question

我正在设计一个仪表板，我需要它占据任何显示器的100％全高。我已经在Stackoverflow上阅读了很多其他帖子，我已经尝试过hv 100％，身高：100％，没有任何工作:(我正在使用Bootstrap 4。要显示仪表板到我的客户我现在已经设置了一个固定的高度，但我需要它才能达到全高。我只是通过共享我所拥有的非常简单的HTML布局编辑这篇文章，显示我需要多少高度每个DIV。 MY LAYOUT HERE

以下是代码：

＆＃13;

<!-- THE ENTIRE DASHBOARD SHOULD TAKE 100% HEIGHT OF ANY SCREEN SIZE -->

<body>
    <div class="container"><!-- 100% HEIGHT -->
      <div class="row">
        <div class="col-12 gray">Top Navigation</div>
      </div>
      <div class="row">
        <div class="col-3 gray">
          Side Table: 100%
        </div>
        <div class="col-9 gray">
          <div class="row">
            <div class="col-5 gray">Box 1: 50% height</div>
            <div class="col-7 gray">Box 2: 50% height</div>
          </div>
          <div class="row">
            <div class="col-9 pink">Box 3: 50% height</div>
            <div class="col-3 pink">Box 4: 50% height</div>
          </div>
        </div>
      </div>
    </div>
  </body>

＆＃13;

Answer 1

将此添加到css

html, body { 
height:100%;
}

然后通过添加height：random％来填充该空间，以确保每个元素都有足够的空间基于其父元素

仪表板100％高度？

1 个答案: