使两个浮动的CSS元素相同的高度

前端之家收集整理的这篇文章主要介绍了使两个浮动的CSS元素相同的高度前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有两个元素可以在高度上变化,并且彼此相邻浮动。问题是如果一个盒子高于另一个盒子,它看起来很丑陋。所以我希望他们是一样的高度。

我认为可能工作的一种方式也是将它们包装在容器div中,并希望更高的一个调整大小,并且较小的扩展以适应空间:

HTML:

<div id="outerBox">
<div class="innerBoxLeft"></div>
<div class="innerBoxRight"><br /><br /><br /></div>
</div>

CSS:

.outerBox
{
width: 100%;
}

.innerBoxLeft
{
float:left;
width: 45%;
height: 100%;
}

.innerBoxRight
{
float:right;
width: 45%;
height: 100%;
}

不行我相信这可能是因为外部的div没有设置的高度,由于某些原因,较小的盒子和100%的高度无关紧要。我不能给它一个设定的高度,因为这会打败这一点。

所以除非另有一种方法,否则我想我问:我如何设置一个子元素的高度为父代?

谢谢

解决方法

你为什么不用桌子?

这太可笑了用户想看表。 HTML语言提供了一个表格元素来实现用户想要的目标。然而,我们使用一个完整的库(我在看JQuery的答案)来实现一个表的目标,即使它意味着一个脚本在客户端上运行!

猜你在找的CSS相关文章