SORU
10 ŞUBAT 2010, ÇARŞAMBA


Nasıl dikey div içinde resim merkezi

Böyle bir işaretleme var:

<div>
  <img />
</div>

Div ımg göre daha yüksek

div {
  height: 100px;
}

img {
  height: dynamic-value-smaller-than-100px;
}

Görüntü dıv (ve bunun üstünde ve altında boşluk aynı sebeple) ortasında olmak istiyorum.

Bu denedim ve çalışmıyor:

div {
  vertical-align: middle;
}

CEVAP
10 ŞUBAT 2010, ÇARŞAMBA


eğer görüntü tamamen dekoratif amaçlıdır, sonra arka plan resmi olarak kullanmak için daha çok semantik bir çözüm olabilir. Daha sonra arka plan konumunu belirtebilirsiniz

background-position: center center;

Değil dekoratif ve değerli bilgiler değildir sonra ımg etiketi haklı. Böyle bir durumda ne yapmak gerekir tarzı aşağıdaki özelliklere sahip içeren div

div{
    display: table-cell; vertical-align: middle 
}

Read more about this technique here. Rapor IE6/7 üzerinde çalışmıyor (IE8 çalışır).

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:
Css

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Amazon Web Services

    Amazon Web S

    8 NİSAN 2009
  • NLthomas21

    NLthomas21

    20 Mayıs 2008
  • Video Copilot

    Video Copilo

    21 EYLÜL 2006