In the CSS forest to discuss a margin problem inadvertently found overflow can also be used to clear floating, hey, this method is not only easy to use, and FF, OP, IE7 all support, from now on can say goodbye to the long compatibility and poor FF clear floating method.
The method is really simple, just add the overflow attribute to the label that needs to be cleared.
CSS Code
Copy the Code code as follows:
ul{
List-style:none;
Height:auto;
Margin:0;p
adding:0;
Background-color: #436973;
}
li{
Float:left;
width:80px;
height:80px;
Background-color: #83B1DF;
}
. demo{
Clear:both;
border:1px solid #FF00FF;
margin-bottom:5px;
}
. overflow{
Overflow:auto;
Zoom:1;
Background-color: #43FF73;
}
ul{
List-style:none;
Height:auto;
margin:0;
padding:0;
Background-color: #436973;
}
li{
Float:left;
width:80px;
height:80px;
Background-color: #83B1DF;
}
. demo{
Clear:both;
border:1px solid #FF00FF;
margin-bottom:5px;
}
. overflow{
Overflow:auto;
Zoom:1;
Background-color: #43FF73;
}
HTML code
Copy the Code code as follows: