[Résolu] Lien dans une infobulle

Bonjour à tous.

Voilà en gros mon problème:

J'ai un lien, qui en rollover doit afficher une infobulle. Dans cette infobulle (un span), j'ai du texte avec un autre lien.

Et c'est la que le problème se pose. Apparement, on ne peut pas imbriquer un <a> puis un <span> puis un <a>

Voici mon code pour vous aider:

<a class="lien" href="#">1er lien
	<span>du texte, du texte, du texte<br />
		<a href="#">un autre lien</a>
	</span>
</a>

<style type="text/css">
	.lien		{ position:relative; }
	.lien span	{ position:absolute; top:20px; left:10px; }
</style>

En fait l'infobulle fonctionne bien mais Firefox "sort" mon 2e lien de l'infobulle et l'affiche à la suite du premier...

(IE 7 arrive à afficher correctement.)
Modifié par <nicolas> (03 Mar 2007 - 11:33)

Voici une illustration de ce que je voudrais obtenir:



Et ce que j'obtiens sur Firefox:

A voir personne n'a entendu parler de ce bug Firefox..

Bonjour,

Comme tu l'as remarqué, on ne peut pas imbriquer un <a> dans un autre <a>. Devant cette erreur, chaque navigateur réagit à sa manière pour la compenser, avec des résultats évidemment inattendus.

Donc, pas de bug, juste un code HTML à revoir.

Ce système m'a l'air d'être une belle catastrophe ergonomique, non ? Ce deuxième lien ne peut-il pas faire partie du contenu précédent ou suivant le premier lien ?

Salut,

Un lien ne peut logiquement pas en contenir un autre. Sinon, quand tu cliquerais sur le lien "interne", sur quel critère dirait-on si on doit aller à l'adresse 1 (externe) ou à l'adresse 2 (interne).
Une question donc :

Tes éléments provoquant l'apparition des info-bulles sont-ils réellement des liens par nature ? En d'autres termes, sont-ils bien censés faire autre chose qu'ouvrir une infobulle, doivent-ils mener quelque part ?

- oui : dans ce cas, il y a logiquement 2 blocs d'informations. Un lien, qui a une destination normale, et qui lorsqu'on le survole provoque l'apparition d'un autre bloc, placé APRES lui (ce n'est donc plus un hover, mais c'est tout à fait gérable en javascript).
- non : dans ce cas, ton élément ouvrant n'est pas un lien. Tu devrais pouvoir utiliser hover sur un autre type d'élément que les liens, mais IE6 ne comprend pas ça. Tu peux alors utiliser le type d'élément que tu souhaites, et utiliser un script comme le whatever:hover pour corriger ce problème, ou faire ton script maison.

Marvin Le Rouge a écrit :
Un lien ne peut logiquement pas en contenir un autre.

Et pourtant, et pourtant... Quand on y regarde de près, certains de nos braves navigateurs font de leur mieux pour suivre

Avec le code ci-dessus et une DTD transitional, en distinguant les liens à l'aide de deux urls différentes:

- IE 7 y va carrément et construit: le premier lien ci-desus (incluant le texte du span), le second lien ci-dessus avec son libellé descendant du premier ... puis une répétition vide de ce second lien

- Opera commence comme IE pour les deux premiers, y compris le lien descendant d'un autre , mais s'arrête tout de même avant d'inventer le 3e lien vide

- FF et Safari, quant à eux, brillent par leur manque total d'imagination et voient deux bêtes liens successifs et non imbriqués (le texte du span étant dans le premier)

Quand on vous dit que la validation, c'est comme les smileys, ça sert parfois à quelque-chose...
Modifié par Laurent Denis (02 Mar 2007 - 19:04)

Merci pour vos réponses.

J'ai effectivement mis un <p> à la place de mon 1er <a>. C'est vrai que c'est illogique d'avoir deux liens imbriqués.

Par contre je vais devoir utiliser javascript à cause de ce *%&ç" d'IE6 ...