make main div容器修复高度

时间:2016-02-13 11:21:28

标签: css

我有一个包含几个div块的div容器(mapInfo-Container) 我希望容器固定高度(250px),div容器可以滚动到超过这个高度的所有东西。

http://jsfiddle.net/dtjmsy/mxt32057/11/

   .mapInfo-Container {
     height: 250px;
     //overflow-y: scroll;
   }

我试过overflow-y:scroll;但是不行,想想我错过了什么。

你能帮帮我吗

由于

3 个答案:

答案 0 :(得分:0)

那是因为.mapInfo-Container包含浮动元素。要打击它,请使用clearfix属性:

<div class="mapInfo-Container clearfix">

另外,请使用overflow-y: auto代替overflow-y: scroll;

这里是fiddle.

答案 1 :(得分:0)

确实有效。小提琴中的问题在于.mapInfo-Block的css。删除宽度并浮动以获取此信息:

.mapInfo-Block {
  background-color: yellow;
  height: 100px;
  border: solid px;
}

你也可以删除div#map-info,并在.mapInfo-Container中取消注释你的其他css规则:

.mapInfo-Container {
  background-color: blue;
  width: 22%;
  float: left;
  height: 250px;
  overflow-y: scroll;
}

http://jsfiddle.net/mxt32057/19/

答案 2 :(得分:0)

添加overflow-y:滚动到mapInfo-Container类

再向pin_0,pin_1和pin_2 div添加一个类 比设定宽度:自动。