En iyi center <div> bir sayfada dikey ve yatay olarak?

SORU

10 Aralık 2008, ÇARŞAMBA

En iyi center <div> bir sayfada dikey ve yatay olarak?

Sayfada <div> merkezi bir öğe için en iyi şekilde yatay ve dikey olarak?

margin-left: auto; margin-right: auto; yatay ama dikey olarak da yapmanın en iyi yolu nedir? merkezi olacak biliyorum

CEVAP

13 Kasım 2012, Salı

En iyi ve en esnek şekilde

* *Benim 10

Bu demo ana hile elemanları yukarıdan aşağıya doğru gidiyor normal akışı içinde, margin-top: auto sıfıra ayarlanır. Ancak, konumlandırılmış öğe boş alan için aynı dağıtım davranır ve aynı şekilde dikey olarak top bottom belirtilen (7) merkezli olabilir.

Bu hile `div` herhangi boyutları ile çalışır.

HTML:

<div></div>

CSS:

div {
    width: 100px;
    height: 100px;
    background-color: red;

    position: absolute;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;

    margin: auto;
}

Bunu Paylaş: