2016-04-01 6 views
0

Drupal-7 web sayfamdan Simplenews haber bülteni modülünü kullanarak bülten göndereceğim. Haber bültenleri temel HTML ve CSS'dir ve her zaman yan yana eklendiklerinde daha büyük bir resim oluşturdukları küçük resimler içerirler.
Bülten, herhangi bir tarayıcıda aldığınız zaman iyi görünür, ancak mobilde aldığınızda, görüntüler aralarında büyük bir boşluk bırakır. Bunu düzeltmek için ne eklemeliyim?
Zaten kullandığım kod. Bu dilimler üzerinde tam resmi kesmek oluşturulan masa koddur ve birkaç css değişiklikleri yaptı:Resim içeren haber bülteni - görüntülü reklamlarda aralarında boşluk var

<table id="Table_01" width="750" height="1636" border="0" cellpadding="0" cellspacing="0"> 
<tr> 
    <td colspan="3"> 
    <a href="link" target="_blank"> 
     <img src="test.png" width="750" height="319" alt="" style="display:block;"></a></td> 
</tr> 
<tr> 
    <td colspan="3"> 
    <a href="link" target="_blank"> 
     <img src="test.png" width="750" height="336" alt="" style="display:block;"></a></td> 
</tr> 
<tr> 
    <td colspan="3"> 
    <a href="link" target="_blank"> 
     <img src="test.png" width="750" height="702" alt="" style="display:block;"></a></td> 
</tr> 
<tr> 
    <td colspan="3"> 
    <a href="link" target="_blank"> 
     <img src="test.png" width="750" height="71" alt="" style="display:block;"></a></td> 
</tr> 
<tr> 
    <td colspan="3"> 
    <a href="link" target="_blank"> 
     <img src="test.png" width="750" height="46" alt="" style="display:block;"></a></td> 
</tr> 
<tr> 
    <td colspan="3"> 
     <img src="test" width="750" height="28" alt="" style="display:block;"></td> 
</tr> 
<tr> 
    <td> 
    <a href="link" target="_blank"> 
     <img src="test.png" width="422" height="44" alt="" style="display:block;"></a></td> 
    <td> 
     <a href="link" target="_blank"> 
     <img src="test.png" width="29" height="44" alt="" style="display:block;"> 
     </a> 
     </td> 
    <td> 
     <a href="link" target="_blank"> 
     <img src="test.png" width="299" height="44" alt="" style="display:block;"> 
     </a> 
     </td> 
</tr> 
<tr> 
    <td colspan="3"> 
     <img src="link" width="750" height="90" alt="" style="display:block;"></td> 
</tr> 

cevap

0

tamir ettim! Gereken şey, tablonun oluşturduğu genişliğin toplam genişliğe eklediği bazı spacer.gif görüntüleri eklemektir.

<tr> 
<td> 
    <img src="images/spacer.gif" alt="" width="272" height="1"> 
</td> 
<td> 
    <img src="images/spacer.gif" alt="" width="12" height="1"> 
</td> 
<td> 
    <img src="images/spacer.gif" alt="" width="6" height="1"> 
</td> 
<td> 
    <img src="images/spacer.gif" alt="" width="233" height="1"> 
</td> 
<td> 
    <img src="images/spacer.gif" alt="" width="37" height="1"> 
</td> 
<td> 
    <img src="images/spacer.gif" alt="" width="35" height="1"> 
</td> 
<td> 
    <img src="images/spacer.gif" alt="" width="12" height="1"> 
</td> 
<td> 
    <img src="images/spacer.gif" alt="" width="67" height="1"> 
</td> 
<td> 
    <img src="images/spacer.gif" alt="" width="286" height="1"> 
</td> 

: Örneğin