HTML and CSS Reference
In-Depth Information
an XML namespace declaration was recommended, this would be the cause of sig-
nificant issues in Internet Explorer.
Not all Doctype declarations render in standards mode. The easiest way to use
standards mode is to use the smallest recommended Doctype, <!doctype html> .
You can use any mix of upper or lowercases in the Doctype declaration (for example,
<!DoCtYpE hTmL> ).
The details behind the clearfix solution
The clearfix CSS class is used to make sure floated elements fit in their parent
container. The very first exploration of this idea occurred in 2002, and is elaborated
further in the article at www.positioniseverything.net/easyclearing.html .
The clearfix selector works in the following manner:
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix { zoom: 1; } /* IE 5.5/6/7 */
The biggest problem with this method is that margins do not collapse consistently
across all browsers. Thierry Koblentz writes more about it at www.tjkdesign.com/lab/
clearfix/new-clearfix.html .
Thierry Koblentz updated this method in 2010 introducing the use of both :before
and :after pseudo-elements in the post at www.yuiblog.com/blog/2010/09/27/
clearfix-reloaded-overflowhidden-demystified/ to be so . Both the pseudo-elements
are used in the following code snippet:
.clearfix:before,
.clearfix:after {
content: ".";
Search WWH ::




Custom Search