最近在项目中遇到使用flex的时候，在flex-item元素中使用text-overflow:hidden；white-space:nowrap；进行省略文字的操作。

发现flex-item失控了，长度完全根据子元素中的文字决定，把其他同级元素挤跑。

最后求助网友，得到解决办法：

1.给flex-item元素增加min-width:0

flex遭遇text-overflow:hidden，white-space:nowrap的更多相关文章

  1. td之overflow:hidden 多余文本隐藏效果

    td之overflow:hidden 多余文本隐藏效果 方法1: table-layout: fixed; width: 200px; 语法: table-layout : auto | fixed ...

  2. 在项目中遇到关于 CSS Overflow Hidden在iPhone & Safari不起作用

    调试了半天 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <m ...

  3. 当鼠标hover的时候，使用tip将overflow:hidden隐藏的文字显示完全

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  4. 移动端浏览器body的overflow:hidden并没有什么作用

    今天突然遇到一个问题,使用li模拟select,但是碰到一个很尴尬的问题,给body加了overflow:hidden,但是body并没有禁止滚动条,滚动条依旧顺滑. <!DOCTYPE htm ...

  5. 解决overflow:hidden在安卓微信页面没有效果的办法

    在做h5移动端时候,发现overflow: hidden;在安卓微信页面失效问题,经研究和实验,用第三种方法和第四种方法可以解决! 1.完全隐藏 在<boby>里加入scroll=&quo ...

  6. CSS Overflow:hidden

    终于知道为什么要设置OverFlow:Hidden了, 看代码: <div id="wrapper"> <figure class="img-wrapp ...

  7. 清除浮动2-父元素设置overflow:hidden

    <!doctype html><html> <head> <meta charset="UTF-8"> <meta name= ...

  8. td内容自动换行 ,td超过宽度显示点点点… , td 使用 overflow:hidden 无效，英文 数字 不换行 撑破div容器

    我们可以先给表格 table上 固定一个宽度 不让表格撑破 width: 747px; table-layout:fixed; 然后我们在td上加上如下样式 style="width:100 ...

  9. overflow: hidden用法，不仅仅是隐藏溢出

    overflow:hidden是大家常用到的CSS样式,但是大多数人对这个样式的理解仅仅局限于隐藏溢出,而对于清除浮动这个含义不是很了解. <!DOCTYPE html> <html ...

随机推荐

  1. cf1040E. Network Safety(并查集)

    题意 题目链接 一张图,n个点,m条边,每个点有个权值x,x<=1e18.如果一条边的两个端点不一样,那么这条边是安全的,开始时所有边都是安全的. 现在有一个病毒y,病毒可以入侵任意的点,入侵一 ...

  2. mysql用户权限操作

    mysql用户权限操作1.创建用户mysql -urootcreate database zabbix default charset utf8;grant all on zabbix.* to za ...

  3. COGS 201. [BYVoid S1] 埃雷萨拉斯的宝藏

    ★★   输入文件:eldrethalas.in   输出文件:eldrethalas.out   简单对比时间限制:1 s   内存限制:256 MB 问题描述 一万两千年前,精灵还是在艾萨拉女王的 ...

  4. linux 命令——28 tar

    通过SSH访问服务器,难免会要用到压缩,解压缩,打包,解包等,这时候tar命令就是是必不可少的一个功能强大的工具.linux中最流行的tar是麻雀虽小,五脏俱全,功能强大.tar命令可以为linux的 ...

  5. tomcat服务器配置域名访问项目server.xml

    <?xml version='1.0' encoding='utf-8'?> <!-- Licensed to the Apache Software Foundation (ASF ...

  6. iphone 弹出键盘，文本框自动向上移动。

    1.让类继承UITextViewDelegate UITextView *inputTextView;UIScrollView * _scrollView; 2.在init函数中先创建scrollVi ...

  7. IOS NSKeyedArchiver（归档存取数据）

    如果对象是NSString.NSDictionary.NSArray.NSData.NSNumber等类 型,可以直接用NSKeyedArchiver进行归档和恢复 不是所有的对象都可以直接用这种方法 ...

  8. POJ 3280 Cheapest Palindrome（区间dp）

    dp[i][j]表示处理完i到j的花费,如果s[i] == s[j] 则不需要处理,否则处理s[i]或s[j], 对一个字符ch,加上ch或删掉ch对区间转移来说效果是一样的,两者取min. #inc ...

  9. 基于Dockerfile 构建redis5.0.0（包括持久化）及RedisDestopManager 监控

    一 创建Dockerfile [root@zxmrlc docker]# mkdir redis [root@zxmrlc docker]# cd redis && touch Doc ...

  10. 【BZOJ4540】 [HNOI2016] 序列（莫队）

    点此看题面 大致题意: 求出一个序列的一段区间中所有子序列最小值之和. 莫队 这道题其实是一道莫队题. 但是需要大量的预处理. 预处理 先考虑预处理两个数组\(lst_i\)和\(nxt_i\),分别 ...