一个div相对于另一个div的动态高度增加

问题描述 投票:1回答:4

我有两个div。这两个div定向为彼此相邻的两个垂直列。我不想通过CSS预先确定div的高度,而是希望它随着我放入的内容而动态增长。这对于一个div很简单,但是我的问题是我希望背景颜色为绿色的左侧的div增长到右侧的div的相同高度。右边总是比​​左边有更多的内容。

css html5
4个回答
1
投票

假设元素在body之后。给身体100%,以及所有的div

body, #div1, #div2 { height: 100%; }

如果不是,那么您必须将父级的高度或链100%的高度重新固定到整个身体。

#parent { height: 800px; }
#div1,#div2 { height: 100%; }

1
投票

将那些div放在父div中,并将其高度设置为100%。


0
投票

您只需要三栏(X)HTML + CSS布局。

here


0
投票
  1. 让我们插入父div(这两个相邻div的容器)
  2. 添加属性'display:flex;'到父级div

.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>
© www.soinside.com 2019 - 2024. All rights reserved.