2013-05-30 13 views
7

Pek çok forumda okudum ve çözümü denedim ancak hiçbiri işe yaramadı. Tüm resimlerim arasında hala küçük bir boşluk var. İşte kod:Bir tabloyu tablo hücresini doldurmaya nasıl zorlayabilirim TAMAMLAYIN

<table id="Table"> 
      <tr> 
       <td id="td1"><h2>~ Curling ~</h2></td> 
       <td id="td2" rowspan="2"><img src="../images/curlingMid.jpg" 
       width="100%" height="100%" border="2" alt=""/></td> 
       <td id="td1"><h2>~ Curling ~</h2></td> 
      </tr> 
</table> 


#td1 { width: 32%;vertical-align: text-top; } 
#td2 { padding-right: 5px; padding-top: 5px; } 
+1

sizin örnekte bir boşluk nerede olurdum görmüyorum. JsFiddle.net üzerinde sorunu gösteren bir örnek oluşturabilir misiniz? Aşağıdaki beyaz boşluk için – j08691

cevap

12

görüntü bir satır içi unsurdur ve çünkü başlangıca hizalanmış nasıl bunun altındaki bazı beyaz alanı vardır. Düzeltmek için

, deneyin:

#td2 img {display: block;} 

veya

#td2 img {vertical-align: bottom;} 

Fiddle demo: resmin üst ve sağ 5px dolgu belirledik http://jsfiddle.net/audetwebdesign/WxrvC/

Not ve bunun stil için olduğunu varsaydım.

Ayrıca, id öznitelikleri bir sayfada benzersiz olmalı, class numaralı telefonu kullanın, korumak çok daha kolay ve CSS kurallarının daha kolay yeniden kullanılmasına izin veriyor.

+2

veya '# td2 {font-boyutu: 0;}' – Prinzhorn

+0

+1 –

2

farklı tarayıcılar aralık vs farklı varsayılan dolgu/marjlar/html Elemanları kılmak .. böyle bu reset deneyebilirsiniz:

#table td {padding: 0px; margin: 0px;} 
#table {border-spacing: 0px;} 
İlgili konular