56
Maîtrise des CSS
l’élément.flottant ?.Vous.devez.appliquer.une.propriété.clear.quelque.part.dans.cet.élément.
(voir.Figure 3.18)..Comme.il.n’existe.pas.d’élément.à.dégager.dans.cet.exemple,.vous.pouvez.
ajouter.un.élément.vide.sous.le.dernier.paragraphe.et.le.dégager..
Div vide pour le dégagement
Le conteneur n'englobe
pas les éléments flottants
Les éléments flottants ne
prennent pas de place
Le conteneur englobe
maintenant les éléments flottants
Figure 3.18
Comme les éléments flottants ne prennent pas d’espace, ils ne sont pas englobés par les éléments
conteneurs. L’ajout d’un élément vide permet d’appliquer le dégagement et force l’élément conteneur
à englober les éléments flottants.
.news {
background-color: gray;
border: solid 1px black;
}
.news img {
float: left;
}
.news p {
float: right;
}
.clear {
clear: both;
}

On.obtient.ainsi.le.résultat.souhaité,.mais.en.ajoutant.du.code.superflu..Souvent,.on.trouve.
un. élément. présent. auquel. appliquer. la. propriété. clear,. mais. il. faut. parfois. manger. son.
chapeau.et.ajouter.du.code.sans.pertinence.sémantique,.aux.seules.fins.de.la.mise.en.forme..