如何包装3个浮动div的绝对div

基本上我有一个容器设置为绝对定位，为此我无法设置宽度或高度...因此它需要自动环绕内容。如何包装3个浮动div的绝对div

但是，在绝对div中，有3个div被设置为“float：left”，这样它们就会堆叠在彼此旁边。

一旦我将父级设置为绝对定位，则3个内部div会跳下来，而父级div不会环绕它们。

有没有可能？所以，我可以换一个绝对股利，约3名漂浮者（并排）

来源

2012-04-25 CK-idiot

你清理左边的浮子吗？ – Umair 2012-04-25 16:33:36

适用溢出：隐藏于母公司的股利

来源

2012-04-25 16:30:50 squarephoenix

确保您使用的是清晰的元素之后的花车（withing你的腹部位置DIV）

Here is the Fiddle for it

CSS：

.left{ 
float:left 
} 
.clearL{ 
height:1px; 
margin-bottom:-1px; 
clear:left; 
} 
#wrapper 
{ 
padding:5px; 
background-color:#e37c00; 
}

HTML：

<div id="wrapper"> 
    <div id="divOne" class="left"> 
     <p>Some content goes here...</p> 
    </div> 
    <div id="divTwo" class="left"> 
     <p>Some content goes here...</p> 
    </div> 
    <div id="divThree" class="left"> 
     <p>Some content goes here...</p> 
    </div> 
    <div class="clearL"> 
    </div> 
<div/>

来源

2012-04-25 16:40:50 TNCodeMonkey

尽管这可能有效，但它比操作问题所需要的复杂得多。另外，在你的例子中，你并没有将绝对定位应用于包装。 – Madbreaks 2012-04-25 16:46:26

@Madbreaks不明白为什么会这么复杂，有几个类和相同的html。此外，您不必应用abs pos来验证容器是否正确包装，这是最初的问题。但是，指出一个出色的工作...... – TNCodeMonkey 2012-04-25 20:23:49

这将这样的伎俩：

div.wrapper { /* outer-most div */ 
    ...  /* other styles */ 
    overflow:auto; 
}

我经常用这个，伟大工程ININ所有现代浏览器。

干杯

来源

2012-04-25 16:44:05 Madbreaks

使用你的方式添加不需要的滚动条，对于这种情况更好地使用'overflow：hidden'来坚持。 – skip405 2012-04-25 18:59:08

如何包装3个浮动div的绝对div

回答

相关问题