<!DOCTYPE HTML Public "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/ Xhtml1-transitional.dtd "><HTMLxmlns= "http://www.w3.org/1999/xhtml"><Head><Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8" /><title>Untitled Document</title></Head><styletype= "Text/css">*{margin:0;padding:0;}#wrap{width:960px;margin:0 Auto;background:#00C;}#header{background:#FF3300;width:100%;}#mainbody{background:#FC0;width:100%;Overflow:Hidden;}. Left{width:820px;Height:400px;background:#36C;float: Left;Margin-right:20px;}. Right{width:120px;Height:600px;background:#0F3;float: Right;}#footer{background:#60C;Clear:both;}</style><Body><DivID= "Wrap"><DivID= "header">Head</Div><DivID= "Mainbody"><Divclass= "Left">Left</Div><Divclass= "Right">Right</Div></Div><DivID= "Footer">Footnote</Div></Div></Body></HTML>
Floating will move mainbody and footer influence, respectively take
1.width:100%;overflow:hidden;
2.clear:both;
HTML notes Landscape Two-column layout