lien entourant un div -> image non cliquable

shinjoku · 27/02/2008, 11h28

bonjour,
pour un projet, j'ai été amené à devoir rendre un div cliquable
je rencontre un probleme lorsque j'indique une largeur, une hauteur ou une position dans le style du div:
l'image cesse alors d'être cliquable
code qui fonctionne ( on a pas encore indiqué de largeur au div) :

Code:

<a style="display:block;hand:hover;border:solid 3px blue;width:50px;padding:0px;" href="http://www.google.fr" target="_blank">   
   <div>
     <img border=0 SRC='http://blonville.unblog.fr/files/2007/11/google.gif'>
   </div>
</a>

code qui plante ( on a indiqué une largeur au div ) :

Code:

<a style="display:block;hand:hover;border:solid 3px red;width:50px;padding:0px;" href="http://www.google.fr" target="_blank">   
   <div style="width:50px;">
     <img border=0  SRC='http://blonville.unblog.fr/files/2007/11/google.gif'>
   </div>
</a>

Sauriez vous pourquoi l'image cesse d'être cliquable lorsque qu'une largeur est ajoutée au style du div ?
Connaitriez vous une "bidouille" pour que l'image reste cliquable?
probleme: je ne peux pas utiliser de javascript ou creer un div avec l'image en background

PS: je sais que normalement il ne faut pas entourer un div par un lien mais dans le cadre
de mon projet je suis obligé de proceder de cette maniere, je sais que ce que je demande
n'est pas du code html valide mais uniquement une bidouille alors les puristes, ne vous formalisez pas !!

merci d'avance

gloup gloup · 27/02/2008, 11h48

Un div est un élément de type bloc, qui ne peut pas se trouver dans un élement A (en ligne), tu devrais utiliser un <span>, je suis sûr que tu auras beaucoup moins de problèmes. Et puis pourquoi ne pas utiliser des classes avec tes éléments?

Code:

<a class="liengoogle" href="http://www.google.fr" target="_blank">   
   <span>
     <img border=0  SRC='http://blonville.unblog.fr/files/2007/11/google.gif' alt="Google">
   </span>
</a>

avec la css :

Code:

a.liengoogle {display:block;hand:hover;border:solid 3px red;width:50px;padding:0px;}

J'espère que tu peux modifier les css.

P.S. : j'ai mis un span mais il ne sert à rien avec l'exemple que je t'ai donné, à toi de voir...

fredmac75 · 27/02/2008, 12h25

Salut,
tu as également cette solution très économique en code

Code:

<style type="text/css">
MaDiv:hover{
  background-color:red;
}
</style>
</head>
<body>
...
<div id="MaDiv"> <a href="#" title="">blabla ...</a></div>

27/02/2008, 11h28	lien entourant un div -> image non cliquable	#1
shinjoku Nouveau membre Date d'inscription: 27/02/08 Messages: 1 Disco:	bonjour, pour un projet, j'ai été amené à devoir rendre un div cliquable je rencontre un probleme lorsque j'indique une largeur, une hauteur ou une position dans le style du div: l'image cesse alors d'être cliquable code qui fonctionne ( on a pas encore indiqué de largeur au div) : Code: <a style="display:block;hand:hover;border:solid 3px blue;width:50px;padding:0px;" href="http://www.google.fr" target="_blank"> <div> <img border=0 SRC='http://blonville.unblog.fr/files/2007/11/google.gif'> </div> </a> code qui plante ( on a indiqué une largeur au div ) : Code: <a style="display:block;hand:hover;border:solid 3px red;width:50px;padding:0px;" href="http://www.google.fr" target="_blank"> <div style="width:50px;"> <img border=0 SRC='http://blonville.unblog.fr/files/2007/11/google.gif'> </div> </a> Sauriez vous pourquoi l'image cesse d'être cliquable lorsque qu'une largeur est ajoutée au style du div ? Connaitriez vous une "bidouille" pour que l'image reste cliquable? probleme: je ne peux pas utiliser de javascript ou creer un div avec l'image en background PS: je sais que normalement il ne faut pas entourer un div par un lien mais dans le cadre de mon projet je suis obligé de proceder de cette maniere, je sais que ce que je demande n'est pas du code html valide mais uniquement une bidouille alors les puristes, ne vous formalisez pas !! merci d'avance

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email
Modes d'affichage
Mode linéaire Choisir le mode hybride Choisir le mode arborescent

Discussions similaires
Discussion	Auteur	Forum	Réponses	Dernier message
Centrer un div et un lien, ensemble	Chamyky	Développement web	2	31/10/2007 12h23
image cliquable , html et css	Hyp	Développement web	5	28/12/2005 20h38
Faire un div cliquable...	neopium	Développement web	2	12/02/2005 17h12
lien cliquable et piéce jointe	bear	Internet et réseau	7	12/05/2004 19h48
Image map dans DIV en position "fixed"???	Agamben	Développement web	8	01/03/2004 10h28

Utilisateurs regardant la discussion actuelle : 1 (0 membre(s) et 1 invité(s))