javascript – 通过.css设置高度=另一个的高度

前端之家收集整理的这篇文章主要介绍了javascript – 通过.css设置高度=另一个的高度前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有两个< 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做
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

请注意,此代码未经测试

谢谢,我希望这将帮助你……问候… 原文链接:https://www.f2er.com/js/154357.html

猜你在找的JavaScript相关文章