Les feuilles de styles CSS
DEUXIÈME PARTIE
118
Grâce à cet élément de séparation, le bloc
englobe désormais les deux paragraphes flottants (figure 7-19).
Utilisée à bon escient, la propriété float permet de nombreuses fantaisies visuelles,
dont la plus fréquente est sans doute de placer une illustration au sein d’un texte de
contenu, mise en page fréquente dans les livres ou la presse.
C’est aussi à cette propriété qu’on recourt pour créer des lettrines de texte en CSS,
application pratique que nous étudierons plus en détail au chapitre 10 (figure 7-20).
À nouveau, tout élément positionné en flottant est considéré de type bloc. Les éléments en ligne peuvent ainsi recevoir des dimensions et des bordures.
Figure 7–19
Correction du
dépassement à
l’aide de clear
Figure 7–20
Une lettrine mise en
place grâce à la
propriété float
SYNTHÈSE Fonctionnement du positionnement flottant
1 L'élément est placé normalement dans le flux, sous l'éventuel bloc qui le précède
et par dessus l'éventuel bloc qui le suit.
2 L'élément doté de la propriété float est ensuite « poussé » à gauche ou à droite
de son conteneur. Dans ce cas, les éléments qui le suivent dans son conteneur prennent place autour de lui.
Précédent

- 145/337

Suivant