CSS Usando la posizione: assoluta


Esempio

Lavorare con i vecchi browser (IE> = 8)

I margini automatici, accoppiati con valori pari a zero per gli offset left e right o top e bottom , centrano gli elementi posizionati in modo assoluto all'interno del relativo elemento principale.

Visualizza risultato

HTML

<div class="parent">
  <img class="center" src="http://lorempixel.com/400/200/" />
</div>

CSS

.parent {
  position: relative;
  height: 500px;
}

.center {
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

Gli elementi che non hanno la loro larghezza e altezza implicite come fanno le immagini, avranno bisogno di quei valori definiti.

Altre risorse: centratura assoluta nei CSS