html弹性布局平均分配,css-flex弹性布局，不用javascript内容就能平均分布，单行或多行文本溢出省略号显示（转载）...

flex 弹性布局特性详解：http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html

问题：容器内的内容平均分布后danh单行文本溢出有问题，单行文本或多行文本溢出，用省略号显示，单行文本white-space:nowrap 没反应问题

解决办法：flex布局特性，使用多行文本溢出省略号显示，解决单行文本省略号的问题

css代码:

#box{

width: 100%;

display: -webkit-flex;

display: -webkit-box;

display: flex;

flex-wrap: nowrap;

justify-content: space-between;

}

.boxInfo{

flex-basis:100%;/*平均分布方法1*/

/*-webkit-box-flex: 1;

-webkit-flex: 1;

flex:1;*//*平均分布方法2*/

height: 20px;

font-size:14px;

overflow: hidden;

text-overflow: ellipsis;

display: -webkit-box;

-webkit-line-clamp:1;

-webkit-box-orient:vertical;

/*white-space: nowrap;*//*单行文本溢出会出现问题这条代码，所以用多行文本溢出来避免*/

}

html代码:

文字文字文字文字费劲啊就是靠金卡吉萨快点见到我的哈哈吓唬大家是拉到了酒啊

咯大开杀戒的就看动漫几乎

加紧对我看见看见撒娇就发哈凯撒科技圣诞节卡加斯哈市的好阿萨德哈哈撒恒大和撒谎交互设计的很婚纱哈市的好结婚

亲爱的读者：有时间可以点赞评论一下