css3 子元素平均宽度

sass代码

.statistics_box { width: 100%; height: 100px; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; display: -webkit-box; display: -moz-box; display: box; margin: auto; div { -webkit-box-flex: 1; -moz-box-flex: 1; box-flex: 1; text-align: center; line-height: 100px; font-size: 36px; color: #fff; } .statistics_item1{ background: #1abc9c; } .statistics_item2{ background: #3498db; } .statistics_item3{ background: #9b59b6; } .statistics_item4{ background: #b6b059; } }

对应的css代码

css代码

.statistics_box { width: 100%; height: 100px; -webkit-box-orient: horizontal; -moz-box-orient: horizontal; box-orient: horizontal; display: -webkit-box; display: -moz-box; display: box; margin: auto; } .statistics_box div { -webkit-box-flex: 1; -moz-box-flex: 1; box-flex: 1; text-align: center; line-height: 100px; font-size: 36px; color: #fff; } .statistics_box .statistics_item1 { background: #1abc9c; } .statistics_box .statistics_item2 { background: #3498db; } .statistics_box .statistics_item3 { background: #9b59b6; } .statistics_box .statistics_item4 { background: #b6b059; }