<display-outside>
Le type de données CSS <display-outside> définit le type d'affichage externe (display) d'un élément, c'est-à-dire son rôle dans le flux de mise en page. Ces mots-clés sont utilisés comme valeurs de la propriété display et peuvent, pour des raisons historiques, être utilisés seuls ou, comme défini dans la spécification de niveau 3, en combinaison avec une valeur parmi les mots-clés <display-inside>.
Syntaxe
Valeurs valides pour <display-outside> :
block-
L'élément génère une boîte de type bloc, ce qui ajoute des retours à la ligne avant et après l'élément dans le flux normal.
inline-
L'élément génère une ou plusieurs boîtes en ligne qui n'ajoutent pas de retour à la ligne avant ou après elles-mêmes. Dans un flux normal, l'élément suivant sera sur la même ligne si l'espace le permet.
Note :
Lorsque les navigateurs rencontrent une propriété display avec uniquement une valeur externe (par exemple, display: block ou display: inline), la valeur interne par défaut est flow (par exemple, display: block flow et display: inline flow).
Cela reste compatible avec la syntaxe à un seul mot-clé.
Syntaxe formelle
<display-outside> =
block |
inline |
run-in
Exemples
Dans l'exemple suivant, les éléments <span>, normalement affichés comme des éléments en ligne, sont paramétrés avec display: block et passent à la ligne en étendant leur conteneur selon l'axe en ligne.
HTML
<span>span 1</span> <span>span 2</span>
CSS
span {
display: block;
border: 1px solid rebeccapurple;
}
Résultat
Spécifications
| Specification |
|---|
| CSS Display Module Level 3 # typedef-display-outside |
Compatibilité des navigateurs
css.properties.display.block
Chargement…
css.properties.display.inline
Chargement…
Voir aussi
-
Les types de données de la propriété
display: