28172 sujets

CSS et mise en forme, CSS3

Problème de focus avec IE8

j'ai une galerie photo avec avec des icones. quand l'icone a le focus ou est active, j'affiche l'image en grand. Bref, rien de très nouveau. Seul pb, tout marche très bien pour FF et les versions antérieures de IE mais avec IE8 les icones sont activés en meme temps et au fur et a mesure que je clique sur mes icones les images s'ampilent les unes sur les autres.
Quelqu'un a t'il eu un pb similaire ?
Christophe
Modérateur
Bonjour,

Comme il existe plusieurs méthodes pour créer une galerie photo, il nous faudrait une url pour tester le problème concrètement.
rebonjour.

J'ai simplifié mon code au maximum pour reproduire mon bug. voici code html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 
 
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>sh-shengyan.com:model</title>
                <script type="text/javascript" src="slidemenu.js"></script>
                <link rel="stylesheet" href="toto.css" type="text/css" media="screen" charset="utf-8" />
        </head>        
<body>
			    <table id="mini" cellspacing="65" >
<tr>
   <td align="center"><a href="#nogo" class="portrait"><img class="default" src="./image1.jpg"/></a></td>
   <td align="center"><a href="#nogo" class="portrait"><img src="./image2.jpg"/></a></td>
</tr>
<tr>
   <td align="center"><a href="#nogo" class="portrait"><img src="./image3.jpg"/></a></td>
   <td align="center"><a href="#nogo" class="portrait"><img src="./image4.jpg"/></a></td>
</tr>
     </table>
        </body>
 
</html>


voici mon code css : 
* {margin:0;padding:0}
body {
	background-color:#3b270e;
}



#mini tr td a img {display:block;width:40px;height:auto;border:1px solid #ffffff;}
#mini tr td a:focus img {display:block;position:absolute; right:85px; top:40px;height:550px;width:auto;}
#mini tr td a:active img {display:block;position:absolute; right:85px; top:40px;height:550px;width:auto;


Pourquoi quand je clique sur mes icones, les images agrandies se superposent-elles ?
Je pense qu'il y a une toute petite erreur dans mon code mais je n'ai pas trouvé laquelle.
Le code marche parfaitement sous FF mais pas sous IE8. Le code marche également pour IE7, quand à IE6 seul une icône sur deux est cliquable. Merci d'avance pour votre aide.
Modifié par chrisgal (13 Jul 2010 - 18:49)
Sujet clos
Aller à