我有一个类似这样的页面结构:

<body>
  <div id="parent">
    <div id="childRightCol">
      /*Content*/
    </div>
    <div id="childLeftCol">
      /*Content*/
    </div>
  </div>
</body>

我想为父div扩大高度时,内部div的高度增加。

编辑: 一个问题是,如果子内容的宽度扩展超过浏览器窗口的宽度,我目前的CSS把一个水平滚动条上的父div。我希望滚动条是在页面级别。目前我的父div被设置为溢出:auto;

你能帮我做这个的CSS吗?


当前回答

您必须在父容器上应用clearfix解决方案。这里有一篇很好的文章解释了修复链接

其他回答

使用像自清除div这样的东西非常适合这种情况。然后你只需在父类上使用一个类…如:

<div id="parent" class="clearfix">

下面的代码对我有用。

css

.parent{
    overflow: auto;
} 

html

<div class="parent">
    <div class="child1">
    </div>
    <div class="child2">
    </div>
    <div id="clear" style="clear:both;"></div>
</div>

你正在寻找一个2列CSS布局?

如果是这样,看看说明,开始是非常简单的。

#{母公司 背景颜色:绿色; 高度:汽车; 宽度:300 px; 溢出:隐藏; } # childRightCol { 颜色:灰色; 背景颜色:黄色; 保证金:10 px; 填充:10 px; } < div id = "父" > < div id = " childRightCol " > < p > 我爱你,我爱你,我爱你。最后的结果就是最后的结果。 < / p > < / div > < / div >

你可以使用overflow:hidden;CSS中的属性

# childRightCol { 浮:正确; } # childLeftCol { 浮:左; } #父 { 显示:内联; }