Problème pour supprimer les bordures d'un tableau (FIREFOX)

Pat_67 le 14 février 2009 à 22h25

Bonjour

Avec Xhtml et CSS, j’essaie de faire un tableau de 2 lignes et 10 colonnes, dans lequel je veux mettre 20 photos.

Je voudrais que ces photos soient collées sans aucune bordure.

Avec Internet Explorer, c’est impeccable.

Mais alors avec Firefox et Opera…gros problème : il y a une ligne horizontale blanche entre la 1ère et 2eme ligne.

Je ne trouve pas la solution pour corriger ça sous ces 2 navigateurs.

Votre aide sera la bienvenue.
Merci

Voici mes codes :

CODE XHTML :

<head>
<title>Essai Tableau</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="essaitab.css" />
</head>
<body>
<table>
<tr>
<td><img src="element1.jpg"></td>
<td><img src="element2.jpg"></td>
<td><img src="element3.jpg"></td>
<td><img src="element4.jpg"></td>
<td><img src="element5.jpg"></td>
<td><img src="element6.jpg"></td>
<td><img src="element7.jpg"></td>
<td><img src="element8.jpg"></td>
<td><img src="element9.jpg"></td>
<td><img src="element10.jpg"></td>

</tr>
<tr>
<td><img src="element13.jpg"></td>
<td><img src="element14.jpg"></td>
<td><img src="element15.jpg"></td>
<td><img src="element16.jpg"></td>
<td><img src="element17.jpg"></td>
<td><img src="element18.jpg"></td>
<td><img src="element19.jpg"></td>
<td><img src="element20.jpg"></td>
<td><img src="element21.jpg"></td>
<td><img src="element22.jpg"></td>

</tr>
</table>

</body>
</html>

CODE CSS :

table, tr, td, img
{
padding: 0px 0px 0px 0px ;

border: none;

border-collapse: collapse;
}

répondre

polov le 20 février 2009 à 12h06

<table cellspacing="0" cellpadding="0">

le cellspacing c'est l'espace intérieur dans la cellule, donc entre le contenu et le bord
le cellpadding c'est l'espace entre 2 cellules

CODE CSS :

table, tr, td, img
{
padding:0;
border: none;
}

-------
Mon site Photoshoplus , plus de 3000 tutoriels pour Photoshop + des milliers de ressources gratuites !
Nouveau : + de 35 000 formes (brushes) à télécharger!

répondre

Pat_67 le 22 février 2009 à 18h40

Merci pour ta réponse mais hélas le résultat est le même à l’écran avec Opera et Firefox.

Avec <table cellspacing="0" cellpadding="0"> rajouté dans le code Html

Et le CSS remplacé par celui indiqué.

répondre

polov le 23 février 2009 à 18h29

oui mais cette "ligne blanche" dont tu parles elle vient d'où ?
est-ce que c'est la couleur de ta page ?

parce que si tu mets une taille à une td donc une cellule
et que l'image qui est dedans ne la remplie pas complètement il y a une différence

donc
laisse ta <td> sans rien et mets l'image avec des dimensions

par exemple <td><img ......width:.. height...></td>

sinon essaye aussi

table, tr, td, img
{
padding:0;
border: none;
margin:0;
}

mais normalement ce n'est pas necessaire

-------
Mon site Photoshoplus , plus de 3000 tutoriels pour Photoshop + des milliers de ressources gratuites !
Nouveau : + de 35 000 formes (brushes) à télécharger!

répondre