Html 100%高度不适用于两个div中的一个

我有三个分区，一个主分区和两个分区。在主div中是navbar和content div，其中包含带有textarea的表单。Textarea仅可垂直调整大小。内容栏和导航栏的最小高度为100%，主栏的最小高度为1200px。主分区和内容分区的高度随textarea大小而变化（这是我想要的），但navbar仍然有0px，并且是“不可见的”

.navbar{
宽度：250px；
最小高度：100%；
位置：相对位置；
背景色：#121212；
浮动：左；
}
梅因先生{
保证金：自动；
最小宽度：1200px；
浮动：左；
}
.内容{
宽度：950px；
最小高度：100%；
背景色：#1c1c；
颜色：白色；
浮动：左；
}
形式{
宽度：100%；
身高：100%；
浮动：左；
}
文本区{
最小高度：297px；
调整大小：垂直；
宽度：800px；
高度：770px；
}

---

在可以更改父级高度的内容上使用

最小高度：100%

（即，它在父级流中，而不是绝对定位）显然会带来一个问题，即它会导致高度无限增加。如果

min height

为

100%

并且您也有

padding:10px

，则子对象的高度将增加，从而增加父对象的高度并导致循环

因此，添加

min height:100%

将不起作用

使用

flex

设置高度可能更好，这样您就有了

display:flex；对齐项目：拉伸父项上的

。

align items:stretch

将导致父元素的子元素“stretch”；到同一高度

例如：

.main{
显示器：flex；
对齐项目：拉伸；
证明内容：之间的空间；
...
}

justify content:space-between

也可以根据需要进行更改

---

你提到最小高度：1200px，但我看到最小宽度：1200px。这是故意的吗？试试100vh；为了100%的高度，我删除了我的答案，因为这一个就足够了。