将高度设置为与旁边漂浮的兄弟div相同?

时间:2015-06-10 16:17:31

标签: html css

所以我有2个div

目前

div#1是{float:left;宽度:48%}并包含一些画廊doodad

div#2是{float:right; width:48%}并包含一堆按钮

之后,在同一容器中,随后会出现一堆其他div和明文。

所以我想做的是让div#1继续做自动高度的事情,但我希望div#2的高度等于div#1,所以我可以垂直拉伸内部的按钮。

我无法访问该结构(埋藏在php框架的深处),我得到的只是CSS。这可能在我目前的限制范围内吗?

3 个答案:

答案 0 :(得分:0)

应用

display: flex;

到周围的容器,然后

float: none;

div#1div#2

注意:如果父容器只包含这两个div,这只是一个可行的解决方案。

Learn more about flex.

答案 1 :(得分:0)

没有看到它很难肯定,但我认为如果div#1和div#2都有高度:100%,那么当div#1从内容“增长”时,父div也是如此,因为两个孩子的div(1& 2)都是父母的100%身高,所以两者都应该平等增长。

答案 2 :(得分:0)

适用于支持CSS3的浏览器。

设置父DIV:

<div id="parent">
<div id="child_1"></div>
<div id="child_2></div>
</div>

然后在CSS中设置#parent_DIV以显示为表(display:table)。每个子DIV设置为显示:table-cell。 在这种情况下,较高的div将设置规则。 为每个(包括父级)添加边框以进行试用并测试它。

我已将其从头部拉出来,但通常会起作用,包括较新的IE浏览器。

这里有更详细的信息: http://www.brenkoweb.com/tutorials/css/css-visual-formatting-model/display-property.php

很快希望会有更多的例子。