Css 滚动和调整大小

Question

我有一个很简单的问题

配图:

我希望地图完全静态并占据 100% 的高度，而另一部分可滚动而无需过滤器即可滚动并占据屏幕的所有其余部分并响应。

目前我手动输入

 .searchresults {
  overflow-y: scroll;
  height: 600px;
}

和

.map{
  height: 1000px;
}

我这里有一个小 css 问题。

如果有人能帮助我，我会很高兴，在此先感谢！

编辑：我在 html 中选择的内容可能有问题：

<div class="small-12 large-4  columns mapblock">
    <div class="responsive-embed map">
      <div id="map"></div>
    </div>
  </div>

地图和结果在 div。

我正在使用框架基础

Answer 1

把这个CSS换成div里面的地图代码。

溢出-x：滚动； 高度：100%；

Answer 2

您可以从 height:100vh 和 position:fixed 到地图包装器开始。

Answer 3

你可以给地图

position:fixed;
height: 100%;
margin: 0;

与过滤器相同。 height:1000 只会在顶部留下空白 space

（抱歉不能发表评论）

Answer 4

此 css 会将您的地图固定在 top-right 角，高度 100%

你可以通过这个css

.map{
   position: fixed;
   height: 100%;
   top:0;
   right:0;
   margin:0;
   padding:0;
}