CSS ist für die meisten von uns immer noch verwirrend: Es hat hunderte schlecht benannte Eigenschaften, von denen jede das Ergebnis auf nicht intuitive Weise beeinflussen kann. Die vertikale Positionierung von Elementen in der Webentwicklung ist tricky und hat in der Vergangenheit oft Kopfzerbrechen bereitet. Doch diese Zeiten sind glücklicherweise vorbei.
Man glaubt es kaum: Im Jahr 2024 ist es nun möglich, mit einer Zeile CSS das gewünschte Resultat zu erzielen:
0f1273b25d9806459716
0f1273b25d9806459716
Früher hat man sich mit einer Vielzahl an anderen Möglichkeiten beholfen, um dasselbe Ergebnis zu erzielen:
Flexbox
0f1273b25d9806459716
Absolute Positionierung
0f1273b25d9806459716
Inline-Block
0f1273b25d9806459716
Der Browser-Support für align-content ist inzwischen sehr gut und es gibt kein gutes Argument mehr, veraltete Techniken zu verwenden. Man benötigt für diese Aufgabe u.a. kein Flexbox mehr und das Child-Element muss (anders als im obigen Beispiel) auch nicht in einem separaten div eingeschlossen werden. Es ist erstaunlich, dass CSS nach Jahrzehnten des Fortschritts erst jetzt über eine einzige Eigenschaft zur Steuerung der vertikalen Zentrierung verfügt.