我有两个< div>元素在
this site.这是一个我正在开发的网站,是一个正在进行的工作,但一些设计选择,我想今晚定稿.现在我简化的.css是：
#leftdiv {
/*this is the navigation pane*/
min-height: 600px;
max-height: 600px;
}
#rightdiv {
/*this is the primary pane*/
min-height: 600px;
max-height: 600px;
overflow-y: auto;
}
我已经设置了最小和最大的高度,所以他们保持相同的高度,如果内容溢出#rightdiv,滚动条出现.我希望这个滚动条已经走了,并且#rightdiv和#leftdiv可以适应#rightdiv的内容.您可以在我链接的页面中看到,有一些内容溢出了#rightdiv和滚动条的边界.我想让整个网站的高度伸展,以适应内容,但如果我删除overflow-y：auto;从我的.css并删除最大高度,#rightdiv延伸,但#leftdiv不会产生一些真正丑陋的设计.
我想要下面的东西：
#leftdiv {
min-height: equal to #rightdiv height if #rightdiv is taller,else 600px;
}
#rightdiv {
min-height: equal to #leftdiv height if #leftdiv is taller,else 600px;
}
如何设置这样的最小高度？
解决方法
我假设你已经使用了height属性,所以我把它与一个高度进行比较
左边用javasript做
左边用javasript做
var right=document.getElementById('rightdiv').style.height;
var left=document.getElementById('leftdiv').style.height;
if(left>right)
{
document.getElementById('rightdiv').style.height=left;
}
else
{
document.getElementById('leftdiv').style.height=right;
}
另一个想法可以在这里找到
HTML/CSS: Making two floating divs the same height
请注意,此代码未经测试
谢谢,我希望这将帮助你……问候…
