动态的DIV与相同高度

可能重复：
How to make floating inner divs the same height as the highest div 动态的DIV与相同高度

我有可变内容的DIV的可变量（内容经由API拉入）。他们都是float: left。你可以在这里找到一个例子：http://playgrounds.affiliate-howto.de/

正如你所看到的，如果在一个DIV中的描述比其他的短，那么设计就会被破坏。

我宁愿用CSS解决这个问题，但找不到解决方案。如果没有，JS也没关系......

来源

2012-03-30 nucci

你可以给所有物品相同的高度？ '.sh_item {height：Npx; }' – mrtsherman 2012-03-30 21:05:44

设计您的网站以处理您拥有的内容。这是一个糟糕的设计问题。 – 2012-03-30 21:17:49

问题是，我没有设计网站或内容。我创建了将API中的内容从用户的wordpress网站中提取出来的插件。所以我不知道会有多少和什么内容。我想得到一个不强制用户更改代码的解决方案。 – nucci 2012-03-30 21:54:35

可以以使的DIV超过一定尺寸不小于（即高度）

来源

2012-03-30 21:05:23

是的，但是如果我这样做了，我得到了更多信息的DIV高于最低高度，我和现在一样。而不是使用最小高度，我可以给所有的DIVs相同的高度值。但是，如果框中的内容较少且空白太多，那看起来不太好。所以这不是一个选项... – nucci 2012-03-30 21:10:25

然后你需要限制产品描述。例如，在最大可以有两条线。在这种情况下，最小高度可以提供帮助（对于仅占一行的标题）。为此，您可以使用标题限制元素的最大高度。 – 2012-03-30 21:13:01

使用“最小高度” CSS属性可以只设置所有的盒子都是312px，这是它的当前尺寸。

你可以用CSS做：

<style type="text/css"> 
.sh_item{ 
height:312px important; 
} 
</style>

或者你也可以做到这一点JavaScript的（jQuery的）方式：

<script type="text/javascript"> 
$(document).ready(function(){ 
    $('.sh_item').css('height', '312px'); 
}); 
</script>

还只是一个小提示，使用ID时，你不应该在文档中不止一次具有相同的元素，因为CSS不会找到该元素（它只会查找第一个元素，而具有相同ID的其余元素将被忽略）。

例如，您正在使用的每件物品sh_id。 ID是为元素提供唯一ID的属性，因此为所有元素提供相同的ID将无法正常使用CSS，也不是ID的要点。你可以做sh_id1,sh_id2,sh_id3等，但它是你的选择。如果要为多个元素提供相同的样式，请使用class属性。

希望这有助于:)

来源

2012-03-30 21:09:29 Shawn31313

谢谢你的回答。是的，我知道这并不意味着有多次唯一的ID。但是DIV是通过php脚本创建的。它正在做的是，它通过api在“spreadshirt.net”上“读取”商店，并为其“接收”的每个产品创建一个DIV。因为有很多不同的商店和产品，所以不能将高度设置为参数。它必须是动态的，并且必须是最高“容器”的高度...... – nucci 2012-03-30 21:40:05

然后使用javascript方法。它仍然会正确调整它们的大小。 – Shawn31313 2012-03-30 21:54:13

我有同样的问题在我的网站一次。这个解决方案对我很有帮助（适用于很多浏览器，也不支持最小高度的样式，比如IE6）：http://www.impressivewebs.com/equal-height-columns-with-javascript-full-version/

来源

2012-03-30 21:10:14 Marek

除了Shawn31313的回答，你应该给你的“sh_name”类特定的高度，比如“25px”并添加overflow：隐藏，以防止重叠文本。

您还可以通过使用PHP修剪文本，如果文本长度超出预期，请添加“...”。

来源

2012-03-30 21:37:41 selo

动态的DIV与相同高度

回答

相关问题