flex:1的元素的父元素必须保证高度或者宽度有具体的数值;如果父元素的高度或者宽度也是flex:1自适应的,最好在父元素上也设置overflow:auto,这样子元素的overflow:auto生效了;(BFC妙用)

.parent{
height:calc(100vh - 100px);
}
// or
.parent{
flex:1;
overflow:auto;
}
.children{
flex:1;
overflow:auto;
}

flex:1的情况下,overflow:auto没有生效的问题的更多相关文章

  1. ie6,ie7下设置overflow:auto下滚动条不起作用

    今天遇到一个比较特殊的情况:ie6,ie7下设置overflow:auto下滚动条出来了但是滚动条不起任何作用,但在火狐,ie8,ie9,谷歌等浏览器下正常显示,解决方案:只需要加一个position ...

  2. IE9父容器overflow:auto时,子容器状态更改导致滚动条下出现额外空间的问题探讨

    IE的每次跟新都会有一些奇葩的bug,我们默默承受了. 这个问题在项目中出现困扰了我近一个星期,这里记录一下.看下面实例 <style> .panel{ width: 200px; ove ...

  3. flex布局下overflow失效问题

    经常我们会使用flex布局,但是flex布局常常会遇到一些不可思议的麻烦,下面介绍一下overflow遇到的麻烦 我在工作中使用了左右两栏布局 .container { display: flex; ...

  4. ios下元素溢出设置 overflow:auto; 不能滑动解决办法

    ios下元素溢出设置 overflow:auto; 不能滑动解决办法: overflow:auto; overflow-y:scroll; -webkit-overflow-scrolling:tou ...

  5. 解决IE6,IE7下子元素使用position:relative、父元素使用overflow:auto后,子元素不随着滚动条滚动的问题

    解决IE6,IE7下子元素使用position:relative.父元素使用overflow:auto后,子元素不随着滚动条滚动的问题   在IE6,IE7下,子元素使用position:relati ...

  6. js+jquery+html实现在三种不通的情况下,点击图片放大的效果

    js+jquery+html实现在三种不通的情况下,点击图片放大的效果. 三种情况分别是:图片的父元素宽高固定;  图片的宽高固定;  图片的父元素宽固定,高度不固定 第一种情况:图片的父元素宽高固定 ...

  7. IOS 浏览器上设置overflow: auto 不可滚动

    项目中最近遇到一个bug,在ios上出现的问题:原页面是在某一块地方滚动,但是改版后,滚动区域改为最外层元素,最外层包裹了一层class为main的div .main { position: fixe ...

  8. CSS清除浮动常用方法小结 CSS clear both {overflow:auto;zoom:1;}

    常用的清除浮动的方法有以下三种: 此为未清除浮动源代码,运行代码无法查看到父级元素浅黄色背景 <!DOCTYPE html><html><head> <met ...

  9. 解决overflow: auto在Ios中滑动不流畅

    [bug]—— H5页面在 ios 端滑动不流畅的问题   IOS系统的惯性滑动效果非常6,但是当我们对div加overflow-y:auto;后是不会出这个效果的,滑动的时候会感觉很生涩.怎么办? ...

  10. css3种不知道宽高的情况下水平垂直居中的方法

    第一种:display:table-cell 组合使用display:table-cell和vertical-align.text-align,使父元素内的所有行内元素水平垂直居中(内部div设置di ...

随机推荐

  1. C# 定时任务模拟,请求二十万数据

    定时器请求二十万数据 最近遇到一个问题,api接口,因为数据内容转换处理.一页1万条数据处理速度3秒以上.假设二十万条数据,分页请求二十次,总共花费时间1分钟以上. 解决这个问题,我第一时间想到并发, ...

  2. mysql 递归

    MySQL中实现递归查询   对于数据库中的树形结构数据,如部门表,有时候,我们需要知道某部门的所有下属部分或者某部分的所有上级部门,这时候就需要用到mysql的递归查询 1.创建表 DROP TAB ...

  3. CV入坑

    https://www.cnblogs.com/fldev/p/14360149.html

  4. 思科交换机BGP配置

    拓扑图后期添加 交换机A配置: Console#show running-configBuilding running configuration. Please wait...!!vlan data ...

  5. P2345 [USACO04OPEN] MooFest G

    简单的一个分块处理:优雅的暴力枚举 #include<bits/stdc++.h>using namespace std; typedef long long ll;const int N ...

  6. Web部署

    1.项目配置的理解 IDEA 中最重要的各种设置项,就是这个 Project Structre 了,关乎你的项目运行,缺胳膊少腿都不行.最近公司正好也是用之前自己比较熟悉的IDEA而不是Eclipse ...

  7. 在POD的ENV中添加POD的信息

    主要用到的参数: - name POD_NAME volumeFrom: fieldRef: fieldPath:   metadata.name - name: POD_IP volumeFrom: ...

  8. springboot的websocket因IP问题无法连接

    首先遇到这个问题有点奇葩,出现在项目上线时的客户现场,头两天一直都无法确定原因,因为它的表现方式很奇怪,基于springboot实现的websocket,同样的代码在公司研发环境不会有问题,客户现场会 ...

  9. AI来实现代码转换!Python转Java,Java转Go不在话下?

    今天看到个有趣的网站,给大家分享一下. 该网站的功能很神奇,可以实现编程语言的转化.感觉在一些场景之下还是有点作用的,比如你原来跟我一样是做Java的,因为工作需要突然转Go.这个时候用你Java的经 ...

  10. D7lsu. 树题

    \(\text{Solution}\) 又是一道考场想到做法写不出来的题 对于 \(\ge x\) 的数全部 \(+1\) 的操作有个很优美的大材小用的想法,那就是分段函数 于是线段树倒着维护分段函数 ...