[HTML/CSS]Espace entre images

Version imprimable

Salut tout le monde,

j'ai une page dans laquelle j'ai 4 images dans des cellules de tableau, mon probleme c'est qu'il y a des espaces entre chacuen d'elles.
Pourtant, j'utilise le padding en CSS, et cellspacing en HTML (puisque le border-spacing ne marche pas sous IE il me semble).
Le truc bizarre mais aps tant que ca est qu'il n y a aucun espace sous Firefox...8O

Je vous mets mon code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<link href="langues/stylesheet.css" rel="stylesheet" type="text/css">
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
		<title>Webby's</title>
	</head>
	<body>
	<table width="860" border="0" cellspacing="0">
	  <tr>
		<td colspan="6"><img src="langues/images/langue_01.gif" width="860" height="84"></td>
	  </tr>
	  <tr>
		<td>&nbsp;</td>
		<td width="224"><img src="langues/images/langue_09.gif" width="224" height="390"></td>
		<td width="141"><img src="langues/images/langue_03.gif" width="141" height="391"></td>
		<td width="112"><img src="langues/images/langue_04.gif" width="112" height="391"></td>
		<td width="151"><img src="langues/images/langue_10.gif" width="151" height="391"></td>
		<td width="193"><img src="langues/images/langue_06.jpg" width="193" height="391"></td>
		<td></td>
	  </tr>
	  <tr>
	  <td></td>
		<td>Fran&ccedil;ais</td>
		<td>Nederlands</td>
		<td>English</td>
		<td>Deutsch</td>
		<td>Español</td>
		<td>&nbsp;</td>
	  </tr>
	</table>
	</body>
</html>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
*{
	margin:0px;
}
 
td{
	padding:0px;
	text-align:center;
}
img{
	border:none; 
}

Merci de votre aide

16/06/2006, 15h40
<romain/>
bonjour,

en faisant ca :
Code:

1 2 3 *{ margin:0px; }
tu dis à tous tes éléments d'avoir une marge nul à gauche, à droite, au dessus et en dessous.

Si tu veux que es images soit séparé tu dois rajouter une marge à ta balise image :
Code:

1 2 3 4 5 img{ margin-left : 5px /*tes images auront une marge de 5px a gauche*/ }
ou :
Code:

1 2 3 4 img{ margin: 5px /*tes images auront une marge de 5px partout autour d'elle*/ }
16/06/2006, 15h42
Psykorel

J'ai du mal m'exprimer, justement je ne veux aucun espace entre mes images maisil y en a quand meme...

Merci
16/06/2006, 15h51
<romain/>

Citation:

J'ai du mal m'exprimer, justement je ne veux aucun espace entre mes images maisil y en a quand meme.

Autant pour moi, c'est plutot moi qui ait mal lu apparement ;)

tu as essayéde mettre un padding : 0 à tes tr?

ahh, les problèmes de mise en page avec les tableaux.....:D
16/06/2006, 16h16
Auteur
bonjour,

ton problème est un classique sous IE, je me demande si la réponse est dans une faq (sinon l'ajouter ;) ). Les marges n'y font rien.

IE ajoute une ligne sous la balise img pour éviter cela il faut ajouter l'attribut align à l'image (ce n'est pas du CSS).
Code:

1 2 3 <img src="...." align="absbottom">
il y a d'autres valeurs pour cet attribut, pour les connaître, un petit tour sur google s'impose.
16/06/2006, 16h35
Psykorel

Ok merci pour vos réponses mais malheureusement aucune ne marche...:roll:
Merci

et comme ça :

Code:

1
2
3
 
 
<table width="860" border="0" cellspacing="0" cellpadding="0">

19/06/2006, 11h18
Psykorel

Merci pour ton aide mais ca non plus ca ne marche pas...
Si vous avez d'autres idées, n'hésitez pas.

Merci
19/06/2006, 11h33
IdF-Socrateus
tu peux toujours ajouter dans ta balise <table :

Code:

<table cellpadding="0" [...] >

et en css :
Code:

1 2 3 4 5 table { border:0; padding:0; margin:0; }
après les tr et td en héritent, normalement...
19/06/2006, 12h00
Psykorel

Désolé, toutjours rien, c'est vraiment bizarre la...8O

Merci quand meme
19/06/2006, 12h22
IdF-Socrateus

on veut voir !

un lien vers ta page stp, sinon je vais avoir du mal à trouver d'autres idées...
19/06/2006, 12h37
masu

le probleme vien de la taille de ta premiere ligne qui est suppérieur a celle de la deuxieme dans ton tableau
largeur du tableau 860
largeur de la deuxieme ligne : 224+141+112+151+193=821
du coup il répartie les cellules sur la taille totale.
pour ne pas avoir ce probleme il faut que ta premiere cellule de la deuxieme ligne prenne toute la place restante.

Code:

<td width="100%"> </td>
19/06/2006, 12h42
Psykorel

C'était ça, je te remercie beaucoup pour ton aide. D'ailleuyrs, je vous remercie à tous pour votre aide.
Mille fois merci.

A plus