使2个div与父母具有相同的高度

我创建了具有divs的2个列的布局，但是列的高度是不同的。我想要一个div将被扩展为另一个高度。使2个div与父母具有相同的高度

这个链接是我的演示http://jsbin.com/UjiyufO/2

请请给我任何建议。

来源

2013-10-29 Khoi Nguyen

这里http://stackoverflow.com/请参阅我的回答a/19630045/1542290 –

Thanks @ Mr.Alien，但是我的div必须显示：block'由于个人原因，不能应用table和table-cell。 –

在你的演示中，我如何在div顶部的第一列创建'hello'，在第二个栏目中'hello'是margin-top 10px –

如果添加此Javascript将工作

$(document).ready(function(){ 
    var myheight= $('#header').height(); 
    var thatheight= $('#content').height(); 
    if(myheight>thatheight) 
    { 
     $('#content').css('height',myheight) 
    } 
    else 
    { 
     $('#header').css('height',thatheight) 
    } 
});

入住这JSbin

来源

2013-10-29 07:13:34

感谢@Deekey的解决方案，但div不会平滑呈现。你有什么建议吗？ –

-1

设置您的2个div的高度相同。示例：

#main div{ 
    height: 500px; 
}

在您的演示中，有一个标记<div>，其中id = main有2个div。那里只需设置2个相同高度的div。

来源

2013-10-29 06:40:04 david

感谢@david，我的页面中的内容只是为了演示，内容可能比长度要高，并且高度必须可扩展作为孩子，另一个div也像另一个div一样扩展（和父div一样） –

确保父元素#main具有完全的高度，或者2个div的100％高度无法工作。

您也可以使用此：

#main{ overflow:hidden; } 
#header,#content{   
    width: 40%; 
    display: block; 
    border: 1px solid; 
    float: left; 
    margin-bottom:-1000px; 
    padding-bottom:1000px; 
}

来源

2013-10-29 06:53:16 lxrmido

使2个div与父母具有相同的高度

回答

相关问题