隐藏overflow-x的滚动条
2017-02-04 11:50
316 查看
.wrap {
width: 100%;
overflow: hidden; //关键
}
.scroll {
width: 100%;
padding-bottom: 100px; //height + padding-bottom 必须大于.wrap height overflow-x: auto;
}
.content {
width: 500%;
background: linear-gradient(90deg,blue 50px,yellow 50px,yellow 100px);
}
<div class="wrap">
<div class="scroll">
<div class="content"></div>
</div>
</div>主要用在移动端，在pc端同overflow: hidden没区别，因为滚动条已被隐藏想移动也移动不了
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 
相关文章推荐
- 关于overflow-x: hidden隐藏滚动条失效的解决方案
- CSS---前端通过 css如何实现overflow:auto滚动超出部分的同时隐藏滚动条？
- CSS中overflow隐藏、滚动条、换行等用法
- 关于overflow-x:hidden;不能隐藏水平滚动条的解决办法
- overflow滚动条消失小技巧
- 隐藏滚动条
- 设置text-overflow文本溢出隐藏时的对齐问题
- IE6的overflowauto的不显示滚动条问题
- 隐藏UITableView和UIScrollVIew的滚动条以及修改滚动条的颜色
- 如何使用CSS隐藏滚动条并且兼容大部分浏览器
- 浏览器隐藏滚动条的小技巧
- vue.js-div滚动条隐藏但有滚动效果的实现
- CSS vw让overflow:auto页面滚动条出现时不跳动
- overflow滚动条无效
- div 显示滚动条与div显示隐藏的CSS代码
- CSS中overflow:hidden在ie6、ie7无效不能隐藏解决办法
- CSS隐藏div滚动条
- safari中overflow:hidden对CSS模糊滤镜溢出隐藏无效解决办法
- HTML 隐藏滚动条和去除滚动条的方法