css 实现文字自动换行切同行元素高度自适应

1.实现div行内布局所有行跟随最大高度自适应

html代码样例：

 <div class="row-single">
 <div class="colspan-title">
 所在部门
 </div>
 <div class="colspan-right">
 <div class="scale-20">
 @ViewBag.decideDetail.departName
 </div>
 <div class="scale-20">岗位</div>
 <div class="scale-20">
 @ViewBag.decideDetail.positionName
 </div>
 <div class="scale-20">定（调）薪时间</div>
 <div class="scale-down">
 @ViewBag.decideDetail.decidePayTime
 </div>
 </div>
 <div style="font: 0px/0px sans-serif;clear: both;display: block"> </div>
 </div>

css样式代码：

 //注意主要实现代码：
 
 /*单行双列*/
 .row-single {
 width: %;
 line-height: 32px;
 border-bottom: 1px solid #D0D6D9;
 box-sizing: border-box;
 flex-wrap: wrap; //主要代码
 align-items: stretch; //主要代码
 display: flex //主要代码
 }
 .scale- {
 float: left;
 width: 189px;
 height: auto;
 line-height: initial;
 word-break: break-all;
 }
 .scale-down {
 width: 160px;
 float: left;
 height:%;
 border-right:none !important;
 }

效果展示：

2.打印效果的修改

页面布局之后使用
@media print｛
//自定义的打印显示样式
｝