Question

我坚持这个麻烦。 http://arenda2.herokuapp.com/catalog 当我使用选择框时，jQuery添加第二个选择框ang height更改。滚动条必须与地图在一行中。

HTML：

<div class="left">
    <div class="filter">
        <p> Some text </p>
    </div>
    <div class="list">
        <p> Some other text </p>        
    </div>
</div>

CSS：

html {
    height: 100%;
    background-color: grey;
}
body {
    margin: 0;
}
.left {
    width: 300px;
    height: 100vh;
    background-color: red;
}

p  {
    margin:0;
    padding:0;
}
.filter {
    background-color: yellow;
}

.list {
    overflow-y: scroll;
    height: 100%;
}

.filter height必须为auto，具体取决于内容。 .list 高度必须使用剩余高度，但不能超出框架100 vh

Answer 1

不确定我是否理解正确，但您需要使用JavaScript。我已更新了JSFiddle

这是JavaScript代码（在jQuery中）：

$(document).ready(function() {
    $('.list').css('height', $(window).height()-$('.filter').height());
});

Answer 2

这里有一个针对您https://jsfiddle.net/n5avavtz/1/

的修复程序

基本上我所做的是将高度点改为百分比。还将overflow-y更改为auto

嵌套div中的100高度

2 个答案: