CSS est encore déroutant pour la plupart d'entre nous : il possède des centaines de propriétés mal nommées, dont chacune peut influencer le résultat de manière non intuitive. Le positionnement vertical des éléments dans le développement web est délicat et a souvent été un casse-tête par le passé. Mais cette époque est heureusement révolue.
C'est à peine croyable : en 2024, il est désormais possible d'obtenir le résultat souhaité avec une ligne de CSS:
0f1273b25d9806459716
0f1273b25d9806459716
Auparavant, on avait recours à une multitude d'autres possibilités pour obtenir le même résultat:
Flexbox
0f1273b25d9806459716
Positionnement absolu
0f1273b25d9806459716
Bloc en ligne
0f1273b25d9806459716
Le site Support du navigateur pour align-content Cette technologie est désormais très performante et il n'y a plus de justification valable pour utiliser des techniques obsolètes. Pour cette tâche, vous n'avez plus besoin de flexbox et l'élément enfant (contrairement à l'exemple précédent) n'a plus besoin d'être placé dans une balise `<body>` distincte. div Il est surprenant qu'après des décennies de progrès, le CSS ne dispose que maintenant d'une seule propriété pour contrôler le centrage vertical.