Question

我有一个这样的页面：

<div id="parent">
    <div id="childA">
        List of some contents
    </div>
    <div id="childB">
        The main content
    </div>
</div>


#childA{
    display: inline-block;
}
#childB{
    display: inline-block;
}

我想将父div的高度设置为childB的高度，但不设置 childA的高度。如果childA作为滚动条，以防它大于childB。 编辑：我刚刚意识到我可以从另一个角度解决问题。希望它能帮助您了解我的需求。 我需要根据其旁边的div的高度（childB）设置div的高度（childA）。

#childB{
    overflow-y: scroll;
}

两个孩子的身高各不相同，但我希望我父母的身高等于childB heigth。我尝试使用表：

#parent{
    display: table;
}
#childB{
    display: table-row;
}

但是childA大于childB时，父母的身高会不断增加

P.S。我知道我可以使用JavaScript，但是我不希望使用它。

Answer 1

我希望下面的示例能使您对childA上的一些高度和溢出Y有所帮助。

#parent {
  display: flex;
  border: 1px solid black;
}

#childA {
  overflow-y: scroll;
  height: 60px;
}

#childB {

}

<div id="parent">
  <div id="childA">
    List of some contents
    List of some contents
    List of some contents
    List of some contents
    List of some contents
  </div>
  <div id="childB">
    The main content
    The main content
    The main contentThe main contentThe main content
    The main content
    The main content
    The main content
    The main content
  </div>
</div>

将一个div的高度设置为另一个div的高度

1 个答案: