我有一个高度为 75% 的外部 div。我有一个内部可滚动的 div A 和另一个内部可滚动的 div B。 div B 可以动态删除,它的高度可变,最大高度。 我想让 div A 根据 div B 自动调整它的高度。
#outer {
position: fixed;
bottom: 0;
left: 100px;
height: 500px;
width: 350px;
background-color: gray;
}
#header {
position: absolute;
top: 0;
width: 100%;
height: 44px;
background-color: blue;
color: white;
}
#footer {
position: absolute;
bottom: 0;
width: 100%;
height: 44px;
background-color: red;
color: white;
}
#content {
position: absolute;
top: 44px;
overflow-y: scroll;
padding: 20px;
height: 200px;
}
#dynamic-content {
max-height: 150px;
overflow-y: scroll;
padding: 10px;
position: absolute;
bottom: 44px;
}
我正在寻找一种纯 css 方法
这是一个 jsFiddle:https://jsfiddle.net/6tr081hb/
最佳答案
我会创建一个 flex
容器,这样您可以通过将 flex
属性设置为动态内容的固定高度和内容的可调整高度1
。
检查 jsfiddle .
我还删除了内容的绝对定位,并向 outer
div 添加了一个 padding
。
关于html - div的动态高度分配,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46339420/