1

我希望容器 div 扩展到 div 内部内容（无序列表）的高度。我无法让它工作。有任何想法吗？

HTML：

<div class="container">
    <ul id="list">
        <li>stuff</li>
        ...
    </ul>
</div>

CSS：（不起作用）

.container {
    width: 332px;
    height: 100%;
    padding: 0.4em; 
    position: relative; 
    overflow-y:scroll; 
    overflow-x:hidden;
}

#list {
    position: absolute;
    height:auto;
    width:317px;
}
4

4 回答 4

4

overflow-y:scroll与您希望它扩展的要求相冲突，因为height:100%100% 基于.container包含元素的高度。

您需要做的是删除height:100%and overflow-y:scroll，替换为overflow-y:hiddenand 我相信它应该可以工作。

PS。为什么你需要#list成为position:absolute？

于 2012-06-07T17:37:45.430 回答
3

从中删除height: 100%;和position: relative;从.container中删除。position: absolute;#list

于 2012-06-07T17:58:46.430 回答
0

两个选项：为#list 添加 height:100%

#list{
position: absolute;
height:auto;
width:317px;
height: 100%;
}

或将容器设为 ID：

#container{
... 
}
于 2012-06-07T17:38:36.670 回答
0

为 .container 设置最小宽度和/或最大宽度属性

于 2012-06-07T18:03:35.463 回答