得到自我的顶部坐标 - > calc(100vh - y)

Question

我有一个元素,我希望它占据它下面的所有空间,直到浏览器窗口的底部.

我可以以某种方式得到元素的y偏移吗？我不知道如何定义y:

.occupy-space-below {
    max-height: calc(100vh - y);
}

Answer 1

而不是使用calc(因为你的上部元素是未知的高度)...
你可以使用flexbox轻松实现这一点

/*QuickReset*/ *{margin:0;box-sizing:border-box;} html,body{height:100%;font:14px/1.4 sans-serif;}


.flex-column {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.grow{
  flex: 1;
  background: gold;
}

<div class="flex-column">

  <div>
    I<br>have <br>unknown<br>height
  </div>

  <div class="grow">
    occupy space below
  </div>

</div>