码迷,mamicode.com
首页 > 其他好文 > 详细

flex布局下overflow失效问题

时间:2018-07-09 11:14:37      阅读:330      评论:0      收藏:0      [点我收藏+]

标签:而且   flex   flow   出现   container   设置   遇到   通过   containe   

经常我们会使用flex布局,但是flex布局常常会遇到一些不可思议的麻烦,下面介绍一下overflow遇到的麻烦

 

我在工作中使用了左右两栏布局

.container {
    display: flex;
}
.left {
    flex: 1;
    overflow: auto;
}
.right {
    width: 500px;
}

 

我的想法是左边宽度要自适应,而且需要滚动条,虽然这样设置了,但奇怪的事情发生,左边的内容并没有出现滚动条,通过查阅资料,可以通过如下办法解决

.container {
    display: flex;
}
.left {
    flex: 1;
    overflow: auto;
    width: 0;
}
.right {
    width: 500px;
}

 

样式需要多加一个 width: 0; 

flex布局下overflow失效问题

标签:而且   flex   flow   出现   container   设置   遇到   通过   containe   

原文地址:https://www.cnblogs.com/wuxianqiang/p/9282040.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!