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

  • Dylan Brenan

    Dylan Brenan

    22 Aralık 2009
  • Elly

    Elly

    3 EKİM 2005
  • GamingAndTech

    GamingAndTec

    16 NİSAN 2013