Startseite » Quellcode » CENTER
Quellcode

CENTER

Ein Element horizontal und vertikal positionieren mit so wenig Code wie möglich und so viel wie nötig.

body {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}

Was auch immer du jetzt in das HTML-Dokument schreibst, es ist genau in der Mitte des Bildschirms.

Demo: https://codepen.io/butschy/pen/NYJKxe

Es gibt auch noch eine weitere Möglichkeit via "grid", hier kommen wir auf nur drei Zeilen.

body {
display: grid;
height: 100vh;
place-items: center center;
}

Finden der IE, Edge, Opera und Safari nur nicht so Geil.

Keine Kommentare

Kommentar


Die Verarbeitung Deiner Daten erfolgt im Rahmen meiner Datenschutzerklärung.

4CMSpowered by 4CMS