<!--two-wing layout ideas: Both fixed-width on both sides, the middle of the adaptive three-column layout, where the middle column in front of the document flow to ensure that the first rendering--><! DOCTYPE html>"en">"UTF-8"> <title> Dual Wing layout </title> <style type="Text/css">. first{Width: -%; }. main{float: left;width: -%;min-height:30px;background-Color:yellow; }. left{float: Left;width:190px;min-height:30px;background-color:red;margin-left:- -%; }. right{Width:190px;min-height:30px;background-color:blue;float: Left;margin-left:-190px; }. Main-wrap{margin-left:200px;margin-right:200px; Background-Color:green; Min-height:30px; } </style>class=" First"> <divclass="Main"> <divclass="Main-wrap"> I am the main column </div> </div> <divclass=" Left"> I am a child column </div> <divclass=" Right"> I'm an add-on column </div></div> </body>Two-wing layout of CSS layout