en étirant celui-ci dans le sens de la hauteur.
Appliquons à présent des dimensions à ces deux éléments (figure 7-5) :
À présent pourvus de dimensions explicites, ces deux blocs se distinguent nettement.
Il reste à placer le paragraphe dans son conteneur, ce qu’on peut réaliser en le laissant
dans le flux mais en précisant des marges en haut et à gauche.
Décalons ce paragraphe de deux caractères (2em) en haut et de trois caractères (3em) à
gauche (figure 7-6) :
div {
width: 300px;
background: yellow;
}
p {
width: 100px;
background: green;
}
Figure 7–5
Positionnement
dans le flux (II)
div {
width: 300px;
padding-top: 2em;
background: yellow;
}
p {
margin-left: 3em;
width: 100px;
background: green;
}
Figure 7–6
Positionnement
dans le flux (III)