Div Container zentrieren?

...komplette Frage anzeigen

5 Antworten

Das MDN ist mMn. die beste Dokumentation (inklusive Beispielen und Tutorials) zu den Themen HTML, CSS und JS:
https://developer.mozilla.org/en-US

Ein Element lässt sich u.a. mittels margin, flex-box, oder grid zentrieren - genaueres siehe MDN.

div (margin:0 auto; width:400px;)

Dabei muss aber das Elternelement ebenfalls eine feste Breite zugewiesen haben (z.B. auch 100%) und am besten setzt du beim Elternelement "text-align:center;"

Letzteres ist nicht notwendig da damit nur die in dem Element vorhandenen Inline-Elemente zentriert werden, nicht jedoch das Element selbst.

0

Kommt drauf an ob horizontal oder vertikal.

Horizontal

.parent {
   display: block; width: 500px; //beliebige Breite
   margin: 0 auto;
}

<div class="parent">
  <p>Lorem Ipsum</p>
</div>

Vertikal

.parent {
  display: table;
}

.inner {
  display: table-cell;
  vertical-align: middle;
}

<div class="parent">
  <div class="inner">
      <p>Lorem Ipsum</p>
  </div>
</div>

Geh halt mal auf die ganzen Codes wie:

https://devopsworld.de/245

und versuche es mal an deiner Seite. (wahrscheinlich WP?) und versuche es auch mal bei so Seiten wie PHP-Sandbox oder Editoren wie Notepad.

Was möchtest Du wissen?