Question

我有一个使用DIV标签的布局，我很难控制div标签的填充以及不必要的滚动条。当“rightside”div标签中的内容未填满屏幕时，页面上仍有一个滚动条。如何切割标签，以便在不需要时不会填充第一个屏幕。

我遇到的第二个问题是当“右侧”div标签中有足够的内容来创建滚动条的需要时，“侧边栏”div标签的背景不会与“右边“

我玩过这么多标签，我不知道从哪里开始。非常感谢任何帮助！

这是我的CSS代码：

.content_container {
border:2px solid red;
overflow: auto;
height:100%;
}

#sidebar {
background:#a4c2c2;
width:231px;
font:12px georgia;
color: #336666;
line-height:18px;
float:left;
position: absolute;
overflow:hidden;
z-index:-1;   
height:100%;
min-height:auto;
}
#sidebar div {
height:2000px;
}
#rightside {
float: left;
 width: 500px;
height:100%;
margin-left:231px;
padding: 10px 0px 0px 25px;
}

http://jsfiddle.net/03hcm6ta/

编辑 -

我几乎用桌子解决了我的问题。然而，有一个奇怪的边界问题发生，我似乎无法解决它。侧栏和右侧div标签似乎没有完全覆盖content_container div。有什么建议吗？

http://jsfiddle.net/eh92awh0/

Answer 1

希望我理解你的问题...你有几个stray / div标签加上你用P打开段落并用/ p和CSS中的一些重复类关闭：）

编辑 - 更新小提琴; http://jsfiddle.net/richardblyth/L9afr65f/

关键是将所有相关元素设置为

height: 100%;
position: relative;

在你的容器上

overflow: hidden;

看我的小提琴：）

Div Tag Heights和滚动条

1 个答案: