Home > Article > Web Front-end > css text automatic line wrapping_html/css_WEB-ITnose
<html><head><style>article{ width:600px; height:200px; display:-moz-box; display:-webkit-box; display:box;}.sectionOne{ background:orange; -moz-box-flex:3; -webkit-box-flex:3; box-flex:3;}.sectionTwo{ background:purple; -moz-box-flex:2; -webkit-box-flex:2; box-flex:2;}.sectionThree{ -moz-box-flex:1; -webkit-box-flex:1; box-flex:1; background:green;}</style></head><article> <section class="sectionOne">010000000000000000000001111111111111111</section> <section class="sectionTwo">02</section> <section class="sectionThree">03</section></article><html>
Define width
.sectionOne{
background:orange;
-moz-box-flex:3;
-webkit-box-flex:3;
box-flex:3;
width :80px;
word-break:break-all;
}