Sous ie6/7, img non cliquable dans la structure a > div > img

Bonjour,
J'ai la structure suivante avec un doctype xhtml1-transitional :

<a href="http://www.google.fr"><div style="float:left;width:275px;height:95px;background:red;"><img src="http://www.google.fr/intl/en_com/images/srpr/logo1w.png" alt="" /><p>texte</p></div></a>

Je sais que ma structure n'est pas valide, à mon sens elle reste très pratique pour rendre réactif un ensemble d'éléments et dispense de faire x liens pour chaque élément

sous IE6/7, l'img n'est pas cliquable
je n'ai pas trouvé sur google de posts à ce sujet

je cherche une solution qui me permettrait de faire un minimum de changement dans le html

Si certains ont des idées, je suis preneur !
merci
P.

Bonjour,

Si on fait du code valide c'est justement pour s'assurer une compatibilité maximum.

Ne pas s'étonner après que cela ne fonctionne pas sous certains navigateurs.

Le but est de faire quoi exactement car il serait étonnant que cela ne soit pas possible en faisant du code valide qui fonctionne partout avec peut-être des ajustements pour certaines versions d'IE.

Bonjour,

Cette structure n'est effectivement pas valide en HTML4 (ou XHTML1), et par conséquent peut poser des problèmes. Un navigateur pourra par exemple estimer qu'il doit fermer automatiquement le lien lorsqu'il rencontre certaines des erreurs d'imbrication de ton code.

En HTML5, du moins dans la spec actuelle (brouillon), la structure <a><div></div></a> est valide. Un navigateur qui implémente l'algorithme de parsing du code HTML de HTML5 devrait donc bien réagir. À ma connaissance le seul navigateur qui implémente cet algorithme est Firefox 4 (beta).

Donc tu sais que ton code n'est pas valide, qu'il le sera en HTML5 mais que les parseurs actuels des navigateurs peuvent mal réagir. Si tu tiens à cette structure, tu peux éventuellement tester en détail le comportement de chaque navigateur. Pour cela le plus efficace sera de vérifier quelle est l'état du DOM une fois ton code HTML parsé. Est-ce que le navigateur ferme automatiquement ton lien plus tôt que tu ne le souhaiterais, par exemple?

Cela dit, ça va dépendre de ton contenu mais j'ai l'impression que tu n'as vraiment pas besoin de ces éléments DIV et P, là où tu pourrais sans doute utiliser des éléments inline tels que SPAN, STRONG, etc.
Un exemple avec du vrai contenu?

faire fonctionner sous IE7 l'exemple de mon 1er post serait déjà d'un grand secours

ma structure est utilisée dans un listing de produits d'une boutique
chaque lien défini un produit avec un titre, un visuel, un prix, une desc courte, un libellé vers la fiche produit
le lien global permet de rendre cliquable l'ensemble

Si j'ai 50 produits donc 50 liens (rien que pour ces blocs) je me vois mal modifier ma structure pour placer un lien sur chaque élément, ce qui me multiplierait par 4 le nb de liens (accroissement du poids de la page, surdensité de liens....)

le bloc produit est donc constitué de 2 divs dont l'une contient le visuel,

<a href="">
  <div style="float:left">
    <img src="mon_visuel" />
  </div>
  <div style="float:right>
    <p>desc courte</p><
  /div>
</a>"

j'ai meme essayé de remplacer les divs flottants par une table (tiens on a perdu knarf ! LOL) mais même échec

s'il faut changer je changerais mais ce me faisait economiser du liens, tant pis
merci pour votre temps
P.