Suppression des espaces entre deux éléments d'image

Question

Il y a 2 petites images sur une page:

<a href="link.htm"><img src="image1.jpg" /></a>

<a href="link2.htm"><img src="image2.jpg" /></a>

Lorsqu'ils apparaissent sur la page, ils n'apparaissent pas directement l'un à côté de l'autre, contrairement à ce à quoi je m'attendais, mais ils sont séparés par un espace.

Je comprends un peu pourquoi cet espace apparaît (après tout, il y a un espace entre eux dans le balisage), mais je ne veux pas qu'il y ait de l'espace.

Answer 1

Comme vous l'avez fait remarquer, il y a un espace entre eux dans le balisage, donc il y a un espace entre eux dans le document rendu.

Pour limiter au maximum les modifications apportées à votre marquage, procédez comme suit:

<a href="link.htm"><img src="image1.jpg" /></a><a
   href="link2.htm"><img src="image2.jpg" /></a>

ou similaire.

Vous pouvez également faire flotter les éléments a left , mais cela risque d'avoir des répercussions sur votre mise en page.

Answer 2

Les images par défaut sont rendues sous forme d'éléments intégrés. Cela signifie qu'ils n'ignorent pas les symboles d'espaces dans leur conteneur. Si vous souhaitez supprimer cet espace, vous pouvez supprimer les espaces eux-mêmes ou créer des éléments au niveau des images à l'aide de règles float: left ou display: block . Vous pouvez également essayer d'encapsuler ces images avec des cellules de tableau, comme ceci:

<table cellspacing="0" cellpadding="0">
 <tr>
  <td><img ...></td>
  <td><img ...></td>
 </tr>
</table>

mais c'est soooo 1999.