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｛
//自定义的打印显示样式
｝