防止元素缠绕浮动的兄弟元素

Question

我想内容 不要包围它的浮动兄弟（可能是浮在内容的左侧或右侧）。

内容后面没有内容，因此包含浮点数/重新排名基线是不可能的。我只想要内容“站起来而不是卷曲”

我知道这可以通过将overflow:auto/hidden放在内容上来轻松完成 - 多次完成。但是，这一次，我不能因为。

• 内容将包含<ul>的继承宽度，而具有box-shadow - 内容将剪切阴影（如果有overflow:auto/hidden
• 我无法在<ul>的两侧设置填充，因为它必须与内容的宽度相同。
• 我不能以任何计量单位明确设置尺寸，填充和边距，就像我放overflow:auto/hidden时一样。这包括（但不限于）添加边距以将包裹移离浮动元素 - 浮动元素的内容在宽度上可能是动态的。

我的html和css在这里：http://jsfiddle.net/QQQB5/2/ - 但是这个使用overflow来阻止包装，但会剪切阴影。

有没有其他方法可以阻止内容不使用overflow？尽可能的，没有黑客，没有“欺骗/欺骗”。如果无法避免，则接受额外加价。

Answer 1

也可以在内容容器上使用float:left，这样就可以了：）

.content {zoom:1; float:left;}

更新

仅仅因为您提供的链接来自2004年使用FNE，现在情况并非如此。

使用CSS3，您只需添加：

.container:after { 
      content: "";
      display: block;
      clear: both;
 }

并且你不会漂浮一切。