我有两个div。这两个div定向为彼此相邻的两个垂直列。我不想通过CSS预先确定div的高度,而是希望它随着我放入的内容而动态增长。这对于一个div很简单,但是我的问题是我希望背景颜色为绿色的左侧的div增长到右侧的div的相同高度。右边总是比左边有更多的内容。
假设元素在body
之后。给身体100%,以及所有的div
body, #div1, #div2 { height: 100%; }
如果不是,那么您必须将父级的高度或链100%
的高度重新固定到整个身体。
#parent { height: 800px; }
#div1,#div2 { height: 100%; }
将那些div放在父div中,并将其高度设置为100%。
您只需要三栏(X)HTML + CSS布局。
是here
.parent{
display: flex;
}
.child1, .child2{
padding: 10px;
border: 1px solid gray;
}
<body>
<div class="parent">
<div class="child1">
CHILD 1 AREA<br />
CHILD 1 AREA
</div>
<div class="child2">
CHILD 2 AREA
</div>
</div>
</body>