是否有一种0宽度的方法来防止浮动的div崩溃

Question

首先，这个问题不是关于当他们的孩子浮动时块元素崩溃的问题。事实上，这个问题与清算无关。

问题是这个。假设我有一系列浮动的div，如：

<div class="column">Column 1</div>
<div class="column"></div>
<div class="column">Column 3</div>

使用css：

div.column { float: left; width: 200px; }

在最新版本的Firefox和Safari中，中间列会崩溃，但显然不是IE7。 我想要的是IE7的行为。

我意识到我可以添加 并且它会保持div打开，但在这种情况下这对我不起作用，因为我也有这样的声明：

div.column input { width: 100% }

我有一系列以类似表格格式的列，某些条件导致输入字段消失。问题是当输入消失时，字段会崩溃。如果我添加 ，它会导致div换行。只是为了避开最初的问题：

• 为什么我不使用表格？因为我使用Scriptaculous Sortable来拖放行，这对表不起作用
• 为什么我不使用较短的像素宽度为 留出空间？因为width: 100%在浏览器中更准确。
• 为什么我在隐藏输入时不添加  我最终会诉诸于此，但在JS中它会有点难看，所以我是希望有更好的方式。

有没有人在这里有任何聪明的黑客？由于Safari和Firefox都采用这种方式，我认为这是官方批准的行为。在W3C规范中讨论了哪些内容？

Answer 1

嗯？你不应该给它一个随机的高度吗？你能展示演示吗？