CSS Master

(Primo) #1
.helptext::before {
content: '( ';
}
.helptext::after {
content: ')';
}

TheresultisshowninFigure1.11.

Figure 1.11. Using ::before and ::after to add supplemental content

Perhapsthemostusefulwaytouse::beforeand::afteristoclearfloatedele-
ments.NicolasGallagherintroducedthistechnique(whichbuildsontheworkof
ThierryKoblentz)inhispost“Anewmicroclearfixhack”:^8

/* Use :before and :after if you need to support IE <= 8 */

.clearfix::before,
.clearfix::after {
content: " "; /* Note the space between the quotes. */
display: table;
}

(^8) http://nicolasgallagher.com/micro-clearfix-hack/
22 CSS Master

Free download pdf