在两列页面上,如何使用CSS或Javascript将左侧div增加到右侧div的相同高度? [英] On a two-column page, how can I grow the left div to the same height of the right div using CSS or Javascript?
本文介绍了在两列页面上,如何使用CSS或Javascript将左侧div增加到右侧div的相同高度?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想使用一个基于div的布局(没有表请!)的两列页面。问题是,我不能增长左div来匹配右边的高度。我的右div通常有很多内容。
I'm trying to make a two-column page using a div-based layout (no tables please!). Problem is, I can't grow the left div to match the height of the right one. My right div typically has a lot of content.
下面是我的模板配对示例来说明问题。
Here's a paired down example of my template to illustrate the problem.
<div style="float:left; width: 150px; border: 1px solid;">
<ul>
<li>nav1</li>
<li>nav2</li>
<li>nav3</li>
<li>nav4</li>
</ul>
</div>
<div style="float:left; width: 250px">
Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna
....
</div>
推荐答案
只需在您的ready函数中调用此函数:
Use jQuery for this problem; just call this function in your ready function:
function setHeight(){
var height = $(document).height(); //optionally, subtract some from the height
$("#leftDiv").css("height", height + "px");
}
这篇关于在两列页面上,如何使用CSS或Javascript将左侧div增加到右侧div的相同高度?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文