Question

所以，

<div id="page-wrap">
  <div id="main-content>
    <div id="main-content-inner">
    </div>
  </div>
</div>

main-content有相对定位，page-wrap有默认定位，main-content-inner有绝对定位。

问题是页面换行高度没有扩展到main-content-inner的高度。 main-content-inner显示得很好，但它显示在页面换行的范围之外。因此，如果我将溢出设置为隐藏在页面换行上，那么我的main-content-inner会被切断。如何使它的页面包装高度扩展到其子容器的最高高度？

#page-wrap {
width:100%;
min-height:100%;
height:auto;
height:100%;
margin-bottom:-20px;
overflow:hidden;

}

#main-content {
width: 100%;

margin-left: -295px;
position:relative;

}
#main-content-inner {
left: 560px;
border-radius:8px;
border-style:solid;
border-width:2px;
border-color:#53D8FF;
padding:20px;
padding-bottom:0;
background-color:#000000;
position:absolute;
top:100px;
min-width:60%;
max-width:60%;


}

Answer 1

如果您使用的是min-height属性，那么为什么要在其后使用height属性。设置height: 100%时，我认为您将#page-wrap高度限制为100％。尝试删除height定义，看看是否能解决问题。

HTML容器未扩展到内容高度绝对定位

1 个答案: