0

我试图弄清楚这一点，而不会在这里造成太多混乱。我有一个容器 div，然后在其中我还有 3 个 div 向左浮动。我的问题是我的容器 div 的高度样式为 100%。像这样

.Container {
height: 100%;
min-width: 600px;
overflow-y: hidden;
 }

并且我在容器 div(sidebar1) 中的一个子 div （为了清楚起见，我只保留一个 div）有这个 css。

 border: 1px solid #E0E0DF;
bottom: 10px;
box-shadow: 2px 2px 4px #888888;
float: left;
height: 100%;
overflow-y: scroll;
width: 18%;
  }

我使用 jquery 将“列表”元素添加到 sidedar1 div。我遇到的问题是我实际上并没有让滚动条出现，直到视图之外有 3 或 4 个项目，甚至当滚动条出现时出现我无法一直向下滚动以查看它们。我知道这与父母的身高为 100%，而孩子的身高也为 100% 相关。我看不到 sidebar1 滚动的底部，而且我为容器 div 隐藏了滚动条。做这个的最好方式是什么？我想要容器 div，它基本上可以扩展用户屏幕的整个长度和宽度，没有任何滚动条，然后在其中我想让我的子 div 向左浮动，但我不希望他们失去视图，如果这使得任何感觉。我希望能够在它们出现时看到它们的完整滚动条。

4

1 回答 1

1

问题是您的容器没有“意识到”它的孩子，因为它们是浮动的。在您的容器上使用 clearfix 解决方案来包含浮动，您应该正确获取滚动条。

不过要小心，因为您将从第一个项目中获得滚动条，因为容器的内容将具有 100% + 2px 的边框高度。您可以通过将浮动元素上的 box-sizing 属性设置为边框框来解决此问题。

Clearfix 主要思想：

.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

一些链接：http ://www.webtoolkit.info/css-clearfix.html

于 2013-09-30T16:20:20.043 回答