0
我想用Flexbox創建一個佔據整個寬度和高度的簡單的兩列網頁。左欄爲固定寬度200px
,右欄佔據剩餘空間。CSS Flexbox全高列
到目前爲止,我有:
: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
佔據所有其他的剩餘空間比200px
是left
佔用的預期。但是,他們不是全高?
這不是重複的,因爲它使用Flexbox的
當然是一個重複的,這意味着_this問題已經有一個answer_,甚至Flexbox,就需要爲它的最外層_flex container_的高度,因爲你使用%的高度,該百分比值是基於它的父母,在這種情況下是「身體」。 – LGSon
您不需要爲此使用flexbox,甚至使用flexbox與解決方案無關。 – TylerH