<分区>
<分区>
我正在尝试使用 Flexbox 创建一个占据整个宽度和高度的简单两列网页。左列的宽度固定为 200px，而右列占用剩余空间。
到目前为止我有:
:root {
overflow-x: hidden;
height: 100%;
}
body {
min-height: 100%
}
.flexbox {
height: 100%;
display: flex;
}
.left {
flex: 0 0 200px;
height: 100%
}
.right {
flex: 1
}
和:
<div class="flexbox">
<div class="left">
Left
</div>
<div class="right">
Right
</div>
</div>
宽度按预期工作，right 占据了除 left 占据的 200px 之外的所有剩余空间。但是，它们不是全高？
这不是重复项，因为它使用了 Flexbox
最佳答案
尝试使用视口(viewport)高度。这将使 div 成为视口(viewport)的完整高度。
.flexbox {
height: 100vh;
display: flex;
}
关于CSS Flexbox 全高列，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46768125/