Web standardization: a simple method to close floating elements

The reason why peripheral elements cannot be well extended lies in overflow, because overflow is invisible. For details, see W3C. Now, you only need to add an overflow: auto; to the peripheral element to solve the problem. The result is that Internet Explorer can be used in addition to Internet Explorer. Next, we will solve the ie problem. With the addition of _ height: 1%;, this problem is completely solved.
The following are three examples for comparison.
1. No closed floating element
2. Non-IE closed floating element
3. Completely closed elements
The code is as follows:

The code is as follows:	Copy code
XHTML <div id = "wrap"> <Div class = "column_left"> <H1> Float left </Div> <Div class = "column_right"> <H1> Float right </Div> </Div>

CSS style:

The code is as follows:	Copy code
# Wrap {border: 6px # ccc solid; overflow: auto; _ height: 1% ;} . Column_left {float: left; width: 20%; padding: 10px ;} . Column_right {float: right; width: 75%; padding: 10px; border-left: 6px # eee solid ;}