是否有一种 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

诶？你不应该给它一个随机的高度吗？可以演示一下吗？