<div class="container3 fl"> <div class="container2 fl"> <div class="container1 fl"> <div class="col1 fl">左 <br/>小时候我有一个梦想,长大了我就忘了...</div> <div class="col2 fl">中 <br/>小时候我有一个梦想,长大了我就忘了...小时候我有一个梦想,长大了我就忘了...</div> <div class="col3 fl">右 <br/>小时候我有一个梦想,长大了我就忘了...小时候我有一个梦想,长大了我就忘了...小时候我有一个梦想,长大了我就忘了...</div> </div> </div> </div>
html, body { margin:0; padding: 0; } .fl { float: left; } .container3 { background:green; overflow: hidden; position: relative; } .container2 { background:yellow; position: relative; right: 30%; } .container1 { width: 100%; background:red; position: relative; right: 40%; } .col1 { width: 26%; position: relative; left: 72%; overflow: hidden; } .col2 { width: 36%; position: relative; left: 76%; overflow: hidden; } .col3 { width: 26%; position: relative; left: 80%; overflow: hidden; }