如何扩展浮动div以占用动态移除的div留下的空间？

Question

这基本上是一个比较页面，在那里你可以比较2-5个产品。

我需要知道我在一个主div中是否有5个浮动div。所有5个div都是动态创建的。当用户选择5个产品进行比较时，主is将填充5个div。但是在用户仅选择2个产品进行比较的情况下。这两个div不会填满空间，只覆盖了两个div的宽度。我要他们把主容器装满。

我希望我说的有道理。如果您需要代码作为参考，请让我知道。

可以使用JavaScript和jQuery。

Answer 1

我想指出您可以使用百分比，但这也不起作用。如果您可以在服务器端设置类名(例如，php-script，它知道应该显示多少列)，则可以定义一个

.twoColumnLayout{
  width:50%;
}

和一个

.threeColumnLayout{
  width:33%;
}

..。

但是如果你使用javascript (例如使用jQuery )，这将会更容易，你可以确定有多少列，然后在页面内动态设置每列的with。

Answer 2

$("<div>").insertAfter(element).css("width", 99 / countColumns + "%")

之所以有99 (而不是100)，是因为有些浏览器不喜欢滚动条的100%宽度和内容的实际换行(你也可以设置overflow: hidden)。

我的jQuery-fu有点生疏，我远离我的开发平台，但上面的示例应该可以工作……:p