本文介绍了如何使具有可变高度内容的3个列的高度相同(&A)的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
HTML：
<ul>
<li>
<div class="one">Variable Height Title</div>
<div class="two">Fixed height middle block</div>
<div class="three">Variable height middle block<br />more content<br /> more contentmore content<br /> more content<br /> more content</div>
<div class="four">Fixed height footer</div>
</li>
<li>
<div class="one">Variable Height Title Might be two lines long</div>
<div class="two">Fixed height middle block</div>
<div class="three">Variable height middle block</div>
<div class="four">Fixed height footer</div>
</li>
<li>
<div class="one">Variable Height Title</div>
<div class="two">Fixed height middle block</div>
<div class="three">Variable height middle block</div>
<div class="four">Fixed height footer</div>
</li>
</ul>
css：
li {
float:left;
width:33%;
}
.one, .three {
background-color:blue;
}
.two, .four {
background-color:green;
}
请看此示例：http://jsfiddle.net/WffHD/
有没有办法只用css使"one"div等于高度(必须是动态的)，然后根据最高的那一列也使所有三列的高度相等？另一种说法是：我希望所有的"一"div都是等高的，然后通过拉伸"三"div的高度，所有列也应该是等高的。不幸的是，由于我使用的插件，它们必须保留为li项。我认为这可以很容易地完成与脚本，但我正在寻找一个css解决方案，如果可能的话。(警告，需要在IE7中工作)希望这是有意义的，谢谢！
推荐答案
用于IE7？
和纯css？
和所有行1(分区"一")高度相等？
和所有列高度相等？
答案是……不可能。这篇关于如何使具有可变高度内容的3个列的高度相同(&A)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！
本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除！