背景,做一个前面图片宽度固定,后面宽度自适应,使用到了flex布局,但是想让后面div里文字不换行,超出以点点表示时,这时布局就乱了,查了下,原来flex布局与white-space:nowrap有影响

解决办法,父div设置min-width:0即可

 <div style="width:100%;display:flex;height:80px"><div style="width:50px"><img src="~/Content/Img/2.png" style="height:50px;" /></div><div style="flex:1;min-width:0">
<div style="width:100%;height:40px;text-align:left;font-size:16px">
*******
</div>
<div style="width:100%;height:40px;text-align:left;font-size:14px;padding-left:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis">
*********
</div>
</div>
<div class="clearfix"></div>
</div>

flex 遇到white-space:nowrap的更多相关文章

  1. dom4j解析xml报错:Nested exception: org.xml.sax.SAXParseException: White space is required between the processing instruction target and data.

    采用dom4j方式解析string类型的xml xml:        String string="<?xmlversion=\"1.0\" encoding=\ ...

  2. flex 遇上white-space:nowrap的2种解决方法

    需求:使用flex布局,超出部分想使用点点点显示 一.方法1使用min-width:0 效果: HTML代码如下: <div class="team-body"> &l ...

  3. White space is required before the encoding pseudo attribute in the XML declaration.

    错误出现的位置: <?xml version="1.0"encoding="UTF-8"?> 正确方式: <?xml version=&quo ...

  4. 微信小程序中如何实现分页下拉加载?(附源码)

    转眼间坚持写教你微信小程序系列已经有十节系列课程了,每天的工作压力繁重,小女子也不知道自己还能坚持这样的系列教程多久.只希望每篇教程真的对大家有帮助.这节课我们要介绍的就是如何实现分页的下拉加载,我们 ...

  5. CSS/CSS3语法新特性笔记

    CSS层叠样式表 三大特性 层叠性:相同的样式会覆盖 继承性:属性可向下继承 优先级:范围越小权重越高 选择器 基础选择器 标签选择器 1 body { 2 color:#fff; 3 } 类选择器 ...

  6. 土旦:关于display:flex碰上white-space nowrap 影响布局的问题

    背景,做一个前面图片宽度固定,后面宽度自适应,使用到了flex布局,但是想让后面div里文字不换行,超出以点点表示时,这时布局就乱了,查了下,原来flex布局与white-space:nowrap有影 ...

  7. flex mxmlc 手动编译项目

    首先: 1.下载flex的sdk,如果你电脑有装flash builder,它自带了一份,位于安装目录的sdks目录下. 备注:(sdk依赖java的jre) 2.配置mxmlc的java运行环境jr ...

  8. 使用flex和bison实现的sql引擎解析

    因为老师要求,近期在做oceanbase存储过程的实现,在oceanbase 0.4曾经是不支持存储过程的.实现的主要步骤主要包含 1.语法解析 2.词法解析 3.详细运行语法树的步骤 如今先来说说语 ...

  9. Windows下 flex + bison 小例子

    .下载flex和bison,网址是http://gnuwin32.sourceforge.net/packages/flex.htm 和http://gnuwin32.sourceforge.net/ ...

随机推荐

  1. Jedis Cluster源码分析

    最近一个项目用到Jedis客户端,需要对这个客户端进行改造.看了一下Jedis Cluster源码,做个记录 首先,说核心内容, 在Jedis源码中,关于cluster有个两个重要的map.一个是no ...

  2. node:fs-extra模块

    var fs = require('fs-extra'); //复制 并会覆盖已有文件 fs.copy('./demo/index.html','./demo/index2.html' ,(err) ...

  3. scale 和 zoom,以及zoom的一些变态用法

    zoom和scale这两个东西都是用于对元素的缩放,一下是其中一些区别: 1.scale的缩小是以图片的中心,zoom的缩小是以图片的左上角. 2.zoom的缩放改变了元素占据的空间大小:而scale ...

  4. JVM Guide

    Java Virtual Machine: the Essential Guide October 8th, 2014 - By Alexey Zhebel Introduction Java Vir ...

  5. AngularJs整合ui-bootstrap以及ui-grid

    1. ui-bootstrap 参考博客:  http://www.cnblogs.com/pilixiami/p/5597634.html  (这篇博客写的非常不错,值得推荐) angular-ui ...

  6. mac nvm install

    open the url https://github.com/creationix/nvm 1. curl -o- https://raw.githubusercontent.com/creatio ...

  7. Profinet网络的RT/IRT容量

    轴数很多的时候,还考虑过PROFINET最大IRT容量的问题. [1]每个Profinet网络的RT个数, simition D 64 CPU 1511/1513-1 128 CPU 1515-2/1 ...

  8. ring0 ShadowSSDTHook

    SSDT:主要处理 Kernel32.dll中的系统调用,如openProcess,ReadFile等,主要在ntoskrnl.exe中实现(微软有给出 ntoskrnl源代码) ShadowSSDT ...

  9. [原]Android打包之Eclipse打包

    Android自动打包流程详细图: 步骤一: 在工程中新建一个build.xml. 步骤二: 给工程配置ant工具. 选择ant工具的步骤如下: Windows->Shown view-> ...

  10. Android(java)学习笔记35:如何改变Spinner系统自带的字体和颜色

    1. 首先我们要知道Spinner系统自带字体和颜色本质: 原生的Spring 控件是无法更改字体和颜色的... 从下面的代码可以看出...红色的标注显示使用的是Android默认的布局.. Spin ...