SORU
12 HAZİRAN 2012, Salı


Merkez div içinde resim yatay olarak Hizala

Bu aptalca bir soru olduğunu biliyorum ama merkezi bir görüntü hizalama zamanki yollar çalışmıyor beri kimlik sormak diye düşündüm. Nasıl (yatay) kapsayıcı div içine resim align miyim?

İşte HTML:

<!--link here-->

<a href="NotByDesign">
 <div id="thumbnailwrapper">

  <a href="NotByDesign">

  <!--name here-->

  <b>Not By Design</b><br>

    <div id="artiststhumbnail">

    <a href="NotByDesign">

     <!--image here-->

      <img src="../files/noprofile.jpg" height="100%" alt="Not By Design" border="1" />       
    </a></div>

  <div id="genre">Punk</div>

Css işte, ayrıca küçük resim ve diğer elemanları için css ekledim. En yüksek öğe her şeyi kapsayıcı, yani azalan içinde çalışır ve en düşük her şey içinde.

#thumbnailwrapper {
    color:#2A2A2A;margin-right:5px;
    border-radius:0.2em; 
    margin-bottom:5px;
    background-color:#E9F7FE;
    padding:5px; 
    border-color:#DADADA; 
    border-style:solid;  
    border-width:thin; 
    font-size:15px
}
#thumbnailwrapper:hover{box-shadow:0 0 5px 5px #DDDDDD}
#artiststhumbnail {
    width:120px; 
    height:108px;
    overflow:hidden;
    border-color:#DADADA;     
    border-style:solid; 
    border-width:thin; 
    background-color:white; 
}
#artiststhumbnail:hover {left:50px }
#genre {
    font-size:12px; 
    font-weight:bold;
    color:#2A2A2A
}

Tamam, PHP olmadan biçimlendirme çok daha kolay olacaktır. İki çözümün pratikte iş gibi görünüyor. Üst ve alt edemiyor metni ortalanmış ve görüntü kapsayıcı div içinde merkezli olmalıdır. Konteyner normalde odak noktası olarak görüntünün merkezinde görmek istiyorum bu yüzden taşma gizli.

CEVAP
12 HAZİRAN 2012, Salı


This guy here öneriler:

Bu yüzden, çeviren, belki de:

#artiststhumbnail a img {
    display:block;
    margin:auto;
}

Edit: Sonunda keman bir hesap oluşturmak için var. İşte benim çözüm: http://jsfiddle.net/marvo/3k3CC/2/

İkinci edit: Değiştirme .#artiststhumbnail için artiststhumbnail.

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

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • calicoJake

    calicoJake

    29 EKİM 2007
  • ImBluecams

    ImBluecams

    25 Kasım 2012
  • kidrauhl

    kidrauhl

    15 Ocak 2007