flex 遇到white-space:nowrap
背景,做一个前面图片宽度固定,后面宽度自适应,使用到了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的更多相关文章
- 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=\ ...
- flex 遇上white-space:nowrap的2种解决方法
需求:使用flex布局,超出部分想使用点点点显示 一.方法1使用min-width:0 效果: HTML代码如下: <div class="team-body"> &l ...
- White space is required before the encoding pseudo attribute in the XML declaration.
错误出现的位置: <?xml version="1.0"encoding="UTF-8"?> 正确方式: <?xml version=&quo ...
- 微信小程序中如何实现分页下拉加载?(附源码)
转眼间坚持写教你微信小程序系列已经有十节系列课程了,每天的工作压力繁重,小女子也不知道自己还能坚持这样的系列教程多久.只希望每篇教程真的对大家有帮助.这节课我们要介绍的就是如何实现分页的下拉加载,我们 ...
- CSS/CSS3语法新特性笔记
CSS层叠样式表 三大特性 层叠性:相同的样式会覆盖 继承性:属性可向下继承 优先级:范围越小权重越高 选择器 基础选择器 标签选择器 1 body { 2 color:#fff; 3 } 类选择器 ...
- 土旦:关于display:flex碰上white-space nowrap 影响布局的问题
背景,做一个前面图片宽度固定,后面宽度自适应,使用到了flex布局,但是想让后面div里文字不换行,超出以点点表示时,这时布局就乱了,查了下,原来flex布局与white-space:nowrap有影 ...
- flex mxmlc 手动编译项目
首先: 1.下载flex的sdk,如果你电脑有装flash builder,它自带了一份,位于安装目录的sdks目录下. 备注:(sdk依赖java的jre) 2.配置mxmlc的java运行环境jr ...
- 使用flex和bison实现的sql引擎解析
因为老师要求,近期在做oceanbase存储过程的实现,在oceanbase 0.4曾经是不支持存储过程的.实现的主要步骤主要包含 1.语法解析 2.词法解析 3.详细运行语法树的步骤 如今先来说说语 ...
- Windows下 flex + bison 小例子
.下载flex和bison,网址是http://gnuwin32.sourceforge.net/packages/flex.htm 和http://gnuwin32.sourceforge.net/ ...
随机推荐
- sql查询结果多对多转为一对多返回前端
企业表 ent_EnterpriseArchives 有id,企业名称 entName veh_Vehicle 车辆表,有所属企业id companyId,车辆id,车牌号licPlate 目的是 ...
- 深入理解 Java 内存模型(转载)
摘要: 原创出处 http://www.54tianzhisheng.cn/2018/02/28/Java-Memory-Model/ 「zhisheng」欢迎转载,保留摘要,谢谢! 0. 前提 &l ...
- 有关satement与preparedstatement
satement 用于写入数据,例子如下: connection conn=DBHelper.getConnection(); Statement stmt=conn.createStatement( ...
- caffe-windows之彩色图像分类例程cifar10
一.caffe-windows之彩色图像分类例程cifar10 训练测试网络模型[参考1][参考2] 1. 准备数据 下载二进制数据集数据集,下载链接为http://www.cs.toronto.ed ...
- sketchup 与 ArcGIS 10 的交互(转)
来自:http://blog.csdn.net/kikitamoon/article/details/9036347 许多用户在 ArcGIS 9.2 时代习惯于使用 Sketchup 插件,但是,9 ...
- .NET开源工作流RoadFlow-表单设计-附件管理
在表单中添加一个附件管理的控件: 文件类型:指定可以上传的文件类型.
- linux注册服务教程
该说明是项目完成很久之后,整理资料时的偶然发现,当时所操作的linux为中标麒麟,需要对项目进行开机自启,对llinux还不熟悉,找不到linux中的服务自启设置.辗转多次才找到了解决方案.记录以供参 ...
- matlab练习程序(单源最短路径Dijkstra)
图的相关算法也算是自己的一个软肋了,当年没选修图论也是一大遗憾. 图像处理中,也有使用图论算法作为基础的相关算法,比如图割,这个算法就需要求最大流.最小割.所以熟悉一下图论算法对于图像处理还是很有帮助 ...
- 使用canvas来绘制折线图
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- spring框架入门day02
0. 绪论 在第二天的学习中的学习JdbcTemplate之前,想要下载最新版本的mysql server8.0.11 结果在将所有的东西配置好后,发现报错, · Establishing SSL c ...