reprint Please specify source www.jb51.net
Please browse to see the effect under Firefox, IE can not see the effect of the
principle is: Under the float with an empty div, can generally solve such problems
the original
<ptml><pead><style type= "Text/css" > body{text-align:center;margin:0;padding:0; . Alldd{background-color: #006600; width:710px;margin:0 auto; . left{Background:blue;height:100px;float:left;width:500px;clear:left;} . right{Background:yellow;height:100px;float:right;width:200px;clear:right;} </style> </pead> <body> <div class= "Alldd" > <div class= "left" > </div> <div CLA Ss= "Right" > </div> </div></body></ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
solve the adaptive height of Firefox. Goodforff
<ptml><pead><style type= "Text/css" > body{text-align:center;margin:0;padding:0; . Alldd{background-color: #006600; width:710px;margin:0 auto; . left{Background:blue;height:100px;float:left;width:500px;clear:left;} . right{Background:yellow;height:100px;float:right;width:200px;clear:right;} . goodforff{clear:both;margin:0;padding:0;font-size:1px;} </style> </pead> <body> <div class= "Alldd" > <div class= "left" > </div> <div CLA Ss= "Right" > </div> <div class= "Goodforff" > </div> </div></body></ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
PS:About the IE6 and IE7 under the div height problem, ie6 under a certain height, affect the actual effect, IE7 and firefix no problem,
Solution 1, font-size:1px;
2, Height:1px;over-float:hidden;
You can solve the problem by writing in the Goodforff.