Deux anomalies sous ie6 : bouton avec contour et a:hover span

Bonjour,

J'ai deux soucis sur un site que j'ai fait pour le mariage de ma soeur et de mon futur beau frère.

www.camilleetmarielaure.fr (mot de passe camil)

Dans la page liste.php, les images sur l'australie et la vaisselle devraient avoir un effet loupe.
Cad que lorsque l'on passe la souris dessus, une image agrandie devrait apparaitre.

Malheureusement sous ie6 cela ne fonctionne pas. Quelqu'un a t-il des pistes de recherche pour m'aider à résoudre ce pb?

Dans la même page le bouton "Je participe au voyage" apparait avec un contour plus gros que les autres boutons (visible uniquement sous ie6). Avez vous une explication ?

D'avance merci.
Modifié par Payalba (18 May 2008 - 20:48)

Bonjour,

Je n'ai pas regardé en détail, mais je pense que tu dois utiliser la pseudo-classe ":hover" pour le "zoom" des images.

Malheureusement, IE6 ne comprend les pseudo-classes que sur les éléments de type <a> (oui c'est con, m'enfin, IE c'est comme ça). Donc... tu devras passer par JavaScript pour les utilisateurs de IE (tu peux aussi utiliser un texte "zoom", qui devrait fonctionner puisque c'est du texte, selon tes préférences).

Pour le bouton, aucune explication. Peut-être essaies-tu de fixer sa taille via CSS ? Ca a tendance à bloquer avec IE6.

Cordialement, SD.

Oui j'utilise la pseudo class hover mais sur l'élément a

En fait l'image "loupe" est dans un span

et les styles sont :

a span
{ 
	display: none;
}
	
a:hover span 
{
	display: inline;
	position:absolute;
	background-color: #EEE; 
	color: #666; 
	border: dotted 1px #333; 
	padding:5px;
}

Pour les boutons a priori non je ne force rien ou alors bien malgré moi

Bonjour,

Je connais la technique, je l'utilise d'ailleurs sur un de mes sites. En fait, le :hover ne fonctionne sur IE que si le contenu du lien est du texte. Toutefois, je ne peux pas confirmer, parce que mon IE6 bug un peu trop, là...

Pour le bouton, que se passe-t-il si tu utilises un texte plus court?

J'ai trouvé pour le survol !!! (Merci Monsieur Goetter)

la solution est page 150 dans le livre CSS2 Pratique du design Web de Raphael Goetter.

Il faut ajouter un

a:hover{
background:none;
}

Pour le bouton, si je mets un texte plus court ça disparait.

Bonjour, J'ai constaté le même problème sauf que c'est juste quand je clique dessus mais ta solution ne marcherait pas pour moi car j'ai un background
Modifié par zaynab87 (19 May 2008 - 09:47)