移动端fiexd内的元素怎么才能滚动呢?

如图
列表父元素是用的fixed定位的,但是里面的列表超出了,怎么才能让他可以滑动呢?
图片描述

<div class="commonClass" v-show="showCityList">
            <div class="" v-for="item in city_list" @click="getNewList(item.id)">{{item.name}}</div>
</div>
.commonClass{
  width: 100%;
  position: fixed;
  top: 90px;
  height: 100%;
  background: #fff;
  overflow: scroll;
  bottom: 0;
}
阅读 781
评论
    1 个回答
    • 1.8k

    CSS overflow 了解一下

    https://developer.mozilla.org...


    这样设置应该是可以滚动的,题主的问题是为什么“山东”下面截掉了吧。把height: 100%;删掉就好了。

    height: 100%;会计算fixmargin之类的偏移,所以很可能直接用的是整个屏幕的高度,这样的话最下面90px实际上是被挤出屏幕了的。

    既然用的是绝对定位,那同时设置topbottom相当于设置了height,所以不需要再次设置了。

      撰写回答

      登录后参与交流、获取后续更新提醒

      相似问题
      推荐文章