Question

我在父DIV中有一个父DIV我左边有两个DIV，第二个在父DIV内右侧我希望当我在左边或右边div标签中写任何内容时，父DIV将根据自动调整左或右DIV标签的高度..

如何编写.css文件来执行此操作？

根据设计视图中的子div不会调整主DIV：

请查看我的代码：

<div style="padding: 8px; overflow: hidden; background-color: #FFFFFF;">
    <div style ="float:left">
        <p>Hi, Flo!</p>
      </div>
      <div style ="float:right; height: 180px;"> 
        <p>is</p>
        <p>this</p>
        <p>what</p>
        <p>you are looking for?</p>
      </div>
    </div>

Answer 1

如果两个子div是浮点数，那么你可以使用：

div.parent{ overflow: hidden; }

指定无高度。

Answer 2

div.parent{ 
     display:  inline-block;
     width:    100%;
}

我发现这是一个非常好的解决方案。如果您有浮动儿童和非浮动儿童，高度将自动调整到所需的最小空间量。宽度设置为100％以扩展到父宽度的父级。

Answer 3

除非您为内部div指定一些浮点数，否则Div大小会自动根据其保留的内容进行调整。如果您有浮动div，则可以使用此解决方案：similar question

如何根据子DIV中的内容自动调整父DIV高度？

3 个答案: