O webu
Margin: auto

Má-li nějaký blokový element nastavenou šířku, jde ho pomocí levého a pravého marginu nastaveného na hodnotu auto vodorovně vycentrovat.

Často je k vidění, že někdo centrování marginem zapisuje předpisem margin: 0 auto. Přitom nula pro horní a spodní odsazení se stejně tak aplikuje při hodnotě auto pro všechny strany. Zápis margin: 0 auto je tedy zbytečně komplikovaný a stačí použít:

.centrovany {
  margin: auto;
}

Výsledek je stejný. Tedy margin-top a margin-bottom budou nulové a element bude umístěn uprostřed.

Nejspíš jediná výjimka, kdy se výsledek margin: auto a margin: 0 auto liší, je centrování absolutním posicováním.

Zachování původního marginu

Pokud je cílem element pouze vycentrovat a zachovat původní hodnoty odsazení, nabízí se dvě možnosti:

  1. Přepsat pouze krají hodnoty:

    .centrovany {
      margin-left: auto;
      margin-right: auto;
    }
  2. Využít klíčového slova inherit. Funkční od IE 8.

    .centrovany {
      margin: inherit auto;
    }

    Hodnota inherit způsobí, že se hodnota podědí.