因为flex属性默认值为flex:0 1 auto;其中 1 为 flex中的 flex-shrink 属性。

该属性介绍:

一个数字，规定项目将相对于其他灵活的项目进行收缩的量。

根据上述介绍可以理解为默认 1 为开启收缩

所以可以将display:flex;下的子元素的flex属性设置为flex:0 0 auto;

解决了display:flex下的子元素设置宽度无效的问题。

display:flex;下的子元素width无效问题的更多相关文章

  1. jquery层级原则器（匹配父元素下的子元素）

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. Flex 4 不同主题下容器子元素的管理方法

    Flex 下,容器主要分两类:Spark容器, Halo容器. Spark容器 Halo容器 说明 numElements numChildern 容器的子元素数量. addElement( ) ad ...

  3. 关于在transform下的子元素设置fixed无效的困惑

    最近的项目是要实现一个点击显示隐藏边栏的效果,而且需要边栏随着滚动而滚动. 思路简单,不就一个css的动画和一个position为fixed,搞定!但不想,设为fixed的子元素竟然无法fixed,这 ...

  4. 使用flex防止fit-content子元素冲出父元素宽度的方法

    父元素设置了min-width:fit-content后,其宽度由子元素的宽度来决定 <!DOCTYPE html> <html lang="en"> &l ...

  5. flex布局取消子元素（img、div等）缩放：

    取消子元素(img.div等)缩放: 父元素: display: flex ; 子元素: flex-shrink: 0;

  6. js 下获取子元素的方法

    笔记核心: firstElementChild只会获取元素节点对象,从名称就可以看出来,firstChild则可以获取文本节点对象(当然也可以获取元素节点对象),比如空格和换行都被当做文本节点. js ...

  7. stylus选中hover元素的兄弟元素下的子元素

    stylus设置兄弟元素样式:鼠标浮动在 .video-li 元素上时,.video-li 兄弟中 .video-info 下的 .word 显示. .video-li &:hover ~ . ...

  8. C# 根据Combobox控件来动态显示TabControl下的子元素

    根据下来列表来动态显示TabControl下的元素 需要准备两个控件:Combobox (命名为:cbPrjType)和 TabControl (命名为:tabPrjType),TabControl下 ...

  9. IE8 td元素 width无效的bug;

    不经意间做项目发现IE的td在某种情况下好奇怪,自己设置的width不起作用: 后经google大法,发现解决方案:已验证过完美解决bug; <table style="width:  ...

随机推荐

  1. 题解 Dove 打扑克

    传送门 考场上觉得复杂度是假的就没怎么优化,然后考完题解帮我证明了它是真的-- 首先合并可以用并查集维护,可以顺便维护出集合的大小 对于操作2,发现如果 \(size_i\) 是确定的,可以用权值线段 ...

  2. C#设计模式---PipeLine

    一.概述 顾名思义,管道模式就像一条管道把多个对象连接起来,整体看起来就像若干个阀门嵌套在管道中,而处理逻辑就放在阀门上,如下图,需要处理的对象进入管道后,分别经过阀门一.阀门二.阀门三.阀门四,每个 ...

  3. 何时覆盖hashCode()和equals()方法

    The theory (for the language lawyers and the mathematically inclined): equals() (javadoc) must defin ...

  4. jQuery最后案例：商标展示

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  5. 《深入理解java虚拟机》第3版笔记3

    第3章 垃圾收集器与内存分配策略 可达性分析算法 在Java技术体系里面,固定可作为GC Roots的对象包括以下几种: 在虚拟机栈(栈帧中的本地变量表)中引用的对象,譬如各个线程被调用的方法堆栈中使 ...

  6. Python和java的选择

    它是什么? Java是一种通用的面向对象的编程语言,主要用于开发从移动应用程序到Web到企业应用程序的各种应用程序. Python是一种高级的面向对象的编程语言,主要用于Web开发,人工智能,机器学习 ...

  7. Go测试--性能测试分析

    目录 前言 认识数据 benchstat 分析一组样本 分析两组样本 小结 前言 benchmark测试是实际项目中经常使用的性能测试方法,我们可以针对某个函数或者某个功能点增加benchmark测试 ...

  8. ES6——简单的多态

    简单的多态 多态: 1.同一个接口,在不同情况下做不一样的事情:相同的接口,不同的表现: 2.接口本身只是一组定义,实现都是子类里面:需要子类去实现的方法(子类只需重写与父类同名的方法,即可达到覆盖的 ...

  9. Linux 单实例oracle安装步骤

    一.查看逻辑盘大小,执行 lsblk 二.查看硬盘及分区信息 ,执行 fdisk -l 三.将物理硬盘分区初始化为物理卷,以便LVM使用 ,创建pv pvcreate /dev/sdb 四.查看物理卷 ...

  10. centos7环境变量配置错误以至于命令不可使用

    2021-07-16 问题: centos7在配置环境变量的时候少打了$,导致很多命令不能使用 解决方法: 在命令行输入: export PATH=/usr/local/sbin:/usr/local ...