360浏览器在兼容模式下,采用display:flex;overflow-y:auto设置样式,为什么还是会出现元素挤压?
360浏览器在兼容模式下(极速模式下以及谷歌和火狐都正常),采用display:flex;overflow-y:auto来设置样式,出现了Y轴滚动条,为什么还是会出现元素挤压?如下图一所示。而图二是没有超出内容,也没有显示Y轴的就是样式正常。以下是样式代码,请大神指点!
.el-checkbox-group{
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
padding: 10px 8px;
height: 450px;
overflow-y: auto;
label{
display: block;
line-height: 38px;
height: 38px;
//height: auto;
cursor: default;
.el-checkbox__label{
font-size: 18px;
font-weight: normal;
cursor: pointer;
color: #409EFF;
text-decoration: underline;
cursor: default;
.game_id{
display: inline-block;
margin-right: 42px;
color: #666;
text-decoration: none;
}
a{
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 140px;
}
}
.el-checkbox__input{
float: right;
cursor: pointer;
margin-top: 10px;
}
}
.el-checkbox__label{
cursor: default;
}
.el-checkbox{
margin-left: 0;
}
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
360兼容模式使用的是IE7内核,所以flex杯具。