1.单行完整显示，多行省略显示。
.box {
width: 100px; //必要
display: -webkit-box; //必要
font-size: 14px;
line-height: 20px;
text-overflow: ellipsis; //必要
-webkit-line-clamp: 2; //必要
-webkit-box-orient: vertical; //必要
}
2.对高度不定的容器设置背景(可能滚动)
.container {
width: 100%;
position: relative; //absolute也能达到效果，视具体情况而定
top: 0;
bottom: 0;
min-height: 100%;
background-color: #f1f1f1;
}
3.单行完整显示，多行正常换行
.box{
width: 100px; //必要
word-warp: break-word; //必要
word-break: break-all; //必要
}
日常实用css布局技巧汇总
原文地址：http://www.cnblogs.com/zifayin/p/7803477.html