[Résolu] Mozilla & div active

Bonjour à tous,

J'ai un petit problème avec les liens en CSS.
Je m'explique, je souhaite faire une menu en HTML et associer les styles aux liens par mes div:
PAGE HTML

<div id='div_link_header'><a href="g1.htm">link_g1</a></div>
<div id='div_link_header'><a href="g2.htm">link_g2</a></div>

PAGE CSS

div#div_link_header a
{
background-color:#cc9900;
float:left;
margin-right:5px;
padding:5px;
}
div#div_link_header a:hover
{
background-color:#ffcc66;
}

Jusqu'ici tout va bien, par contre le problème se pose concernant les liens actifs

div#div_link_header a:active
{
background-color:#ffcc66;
}

En effet, le a:active n'est pas interpréter de la même manière sous ie et sous mozilla.
- Sous ie le background se change lorsque le div a été cliqué et conserve se couleur, donc lorsque le lien appelé est actif.
- Et sous moz le background se change seulement sur le onclick.

Existe-il une solution en CSS pour conserver une couleur de fond après un click sur un div avec Mozilla ?

Merci d'avance

Olive
Modifié par olk2rr (09 Nov 2006 - 09:27)

Bonjour et bienvenu à toi

Ton problème me semble assez bizarre car pour ma part je n'ai jamais noté de différence d'interprétation entre IE et FF à ce niveau-là. Cependant, je te conseillerais déjà de remplacer tes id par des class (car un identifiant se doit d'être unique dans la page) :

<div [#red]id='div_link_header'[/#]><a href="g1.htm">link_g1</a></div>
<div [#red]id='div_link_header'[/#]><a href="g2.htm">link_g2</a></div>

A consulter : Quelle est la différence entre une classe et un id ?

Et sinon : est-il normal que ton background (sur hover et active) soit le même ?

div#div_link_header a:hover {
background-color:#ffcc66;
} 

div#div_link_header a:active {
background-color:#ffcc66;
} 

Modifié par Cygnus (08 Nov 2006 - 17:13)

Salut.

J'ajoute aux remarques de Cygnus qu'une liste non ordonnée <ul> serait plus appropriée que des <div>.

a écrit :
Existe-il une solution en CSS pour conserver une couleur de fond après un click sur un div avec Mozilla ?

Tu veux dire pour marquer la page que l'on est en train de visiter, ou simplement une couleur différente lorsqu'on maintient le bouton de la souris enfoncé au-dessus du lien ?

corrigé !
en fait l'iD me permettait d'avoir un css sur le div différent de celui du a href mais je n'en ai plus besoins

J'utilise deux frames (je sais qu'il faut les évités...), une première avec les liens du menu qui appelent des pages dans la seconde.

Lorsque que je survole les div du menu, le background change, parfait !
Par contre lorsque je clique sur le div je souhaite que le background du div clické conserve une couleur pour que l'on sache que la page ouverte dans l'autre frame correspond bien au div séléctionné dans le menu...

a écrit :
Tu veux dire pour marquer la page que l'on est en train de visiter, ou simplement une couleur différente lorsqu'on maintient le bouton de la souris enfoncé au-dessus du lien ?

Tout à fait je souhaite marquer la page que l'on est en train de visité.

Dans ce cas, c'est par ici

Le but n'est justement de ne pas utiliser du php ou du javascript... sinon je le ferai en javascritp avec des flag sur le onclick...

je souhaite obtenir la même chose en full css comme pour ie, si c'est possible biensûr.

olk2rr a écrit :

- Et sous moz le background se change seulement sur le onclick.

Bonjour,

C'est le comportement normal de a:active : comportement au moment du click et non, comme on le comprend souvent, lien actif par rapport à la page.

"Maître Laurent" a écrit :
Un lien reçoit d'abord le focus. L'utilisateur peut alors l'activer. Après activation (qui est un état très temporaire), il devient un lien visité.

Il n'y a pas de propriétés css permettant de spécifier qu'un lien correspond à une page active. Il faut donc avoir recours à des astuces comme celles proposées dans les liens ci-dessus.

et bien je te remercie, je voulais en avoir la certitude !!!
Alors je vais faire ça en javascript.

Ne pas oublier le petit résolu ...