Bonjour,

En fait je souhaite effectuer une mise en page particulière dans un site, une mini-gallerie de 4 images cliquables qui ouvre chacune la même image dans un format plus grand. A ce niveau, aucun problème. Le problème se situe dans le rendu chez IE.

J'ai un code de ce type sur ma page :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
 
				<table>
				<tr>
					<td> <img src="moz1.jpg" onclick="window.open('mozart1.jpg','MaPopupImg1','width=600,height=450');" /> </td>
					<td> <img src="moz2.jpg" onclick="window.open('mozart2.jpg','MaPopupImg2','width=600,height=450');" /> </td>
				</tr>
				<tr>
					<td> <img src="moz3.jpg" onclick="window.open('mozart3.jpg','MaPopupImg3','width=600,height=450');" /> </td>
					<td> <img src="moz4.jpg" onclick="window.open('mozart4.jpg','MaPopupImg4','width=600,height=450');" /> </td>
				</tr>
				</table>
Le rendu sur IE est merdique, en bas de chaque image de chacune cellule <td> il y a un espace (padding-bottom?) qui est inséré inutilement à chaque fois, alors que ça ne le fait pas sur les autres navigateurs.

Quelque soit les paramètres que j'ajoute en CSS cela n'arrange rien.

Est ce qu'il y aurait moyen de coutourner ce bug de IE, est-ce bien un bug ou une mauvaise mise en forme de ma page ?

Mon code css associé est le suivant :
Code css : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
 
table {
	border : 1px #5F5F09 solid ;
	width : 135px ;
	height : 140px ;
	padding : 1px ;
	background-color : #EAEDC5 ;
	border-collapse : collapse ;
}
td {
	border : 1px #5F5F09 solid ;
	background-color : #EAEDC5 ;
}

Merci !