Comment faire des liens dans des liens, ... en css

salut, monpatron me demande de faire une fenetre genre info bulle sur un lien, ... avec dedans du texe, des images, (juque là pas de probleme) mais c'est en voulant inserer un autre lien hptx que là ça bug et que je ne sais plus comment faire, ... si quelqu'un à une idée, une suggestion, voir meme une solution, je suis preuneure, ... merci
ps, : si je trouve une sollution, je la posterai ici aussi, ...
@+
zefre petit

Malheureusement, on ne peut pas inclure de balise <a> dans une autre balise <a> Ce n'est pas un problème de CSS, mais de structure (HTML/XHTML)

un peu mais je m'en doutai, ...
faut-il donc passer par un bon vieux java script genre afficher / masquer les calque afin de simuler une info bulle avec un lien hptx, ... ?
ps, ... bien exelent le site, on y apprend plein de trucs, ... exelent

En CSS pur, tu peux faire cela sur n'importe quel élément. Seul Internet Explorer ne le gèrera pas...

Donc effectivement, le JS est nécessaire, mais il faudra toutefois prévoir le cas où JS n'est pas présent

Et pourquoi ne pourrait on pas mettre l'info bulle dans un élément frère de l'élément lien ?

Tout simplement parce qu'IE ne reconnaît les "survols (":hover") que sur l'élément lien (a). En CSS pur, ça fonctionnerait, mais il faut passer par du Javascript pour que ça apparaîsse sous IE.

Et voilà, encore une fois, comment Microsoft a décidé d'arrêter l'avancée technologique en bloquant le développement de son navigateur quasi-monopolistique.

@+, HoPHP

En fait, si le but de cette manoeuvre est de pouvoir mettre un lien cliquable dans l'info-bulle, le hover sur l'élément ne suffirait pas car dès qu'on quitterait l'élément parent pour aller cliquer le lien de l'info-bulle, l'état de l'élément parent ne serait plus en hover. Il faudrait quand même du Javascript pour laisser l'info-bulle visible assez longtemps pour que l'utilisateur puisse avoir le temps de cliquer sur le lien.
Modifié par Merkel (02 Mar 2005 - 19:34)

@ HoPHP> je pensais à quelque chose comme a:hover + div.bulle {visibility: visible}, mais Merkel a raison, il va devenir difficile de cliquer.

Quitte à utiliser javascript, je conseille IE7

Non, en CSS pur, c'est tout à fait faisable. Exemple:
(x)HTML

<span class="lien"><a href="#">Contenu du lien</a><span class="descriptif">Ici, un petit descriptif, avec un <a href="#">lien</a></span></span>

CSS

.lien:hover .descriptif {
display: block;
/*(...) */
}

Ca valide ça, non ?

@+, HoPHP

Il m'arrive à l'occasion de douter un peu de ce genre d'astuce. Je croyais que le (x)html était fait pour structurer un document, le CSS pour en faire la mise en page, et finalement, le Javascript pour l'interactivité. Je me demande juste comme ca, sans prétention de vouloir partir un débat sur le sujet, si nous ne détournons pas un peu l'objectif des CSS ? Ceci dit, j'aime bien les rollovers en css pur, c'est tellement plus propre, mais c'est quand même une question qui me turlupine l'esprit, pas vous ?

@ HoPHP> Oui c'est valide de cette façon, mais pas exactement l'hypothèse dans laquelle je me plaçais.


1/ je souhaitais avoir a:hover (suite à ta remarque disant que IE ne supporte pas le hover sur un autre élément)
2/ mettre la bulle dans un élément autre que a (suite à la remarque de Raphaël plus haut)

Bon mais tout ça est peine perdue, IE sans javascript n'y retrouvera pas ses petits.
C'est pour ça que je préconisais IE7 (javascript) qui permet quand même d'écrire du CSS comme si de rien n'était (le code que tu proposes par exemple) et qui fonctionnera pour tous les navigateurs y compris IE cette fois.

@ Merkel> tu veux dire que l'existence de :hover te semble étrange en CSS ?
Modifié par Xavier (02 Mar 2005 - 23:32)

Merkel a écrit :
mais c'est quand même une question qui me turlupine l'esprit, pas vous ?

Je me suis déjà turlupiné à ce propos aussi
On m'a répondu que j'étais trop puriste

Il est vrai que :hover est à la frontière entre ce que doit faire CSS et ce que doit faire Javascript.