Clear floating 2-parent element settings overflow: hidden, 2-overflow
<! Doctype html>
<Html>
<Head>
<Meta charset = "UTF-8">
<Meta name = "Author" content = "Hu Chao">
<Title> super Hu </title>
<Style>
. News {
Background-color: gray;
Border: solid 1px black;
Overflow: hidden;
Zoom: 1;
/* Parent element overflow: hidden
Set the overflow value of the parent element to hidden. in IE6, hasLayout needs to be triggered, for example, zoom: 1;
Usage of Zoom:
Zoom: normal | number normal:
Default value. Use the actual size number of the object:
Percent | unsigned floating point real number. When the floating point value is 1.0 or the percentage is 100%, it is equivalent to the normal value of this attribute. in the vernacular, It is zoom: the following number is a magnification, which can be a value or a percentage. For example, zoom: 1, zoom: 120%. This attribute only works in IE, so it is rarely used in actual use, and is most often used to clear floating. */
}
. News img {
Float: left;
}
. News p {
Float: right;
}
</Style>
</Head>
<Body>
<Div class = "news clearfix">
<P> some text </p>
</Div>
</Body>
</Html>