[HTML/CSS] :hover qui souligne les ancrages

:hover qui souligne les ancrages [HTML/CSS] - HTML/CSS - Programmation

Marsh Posté le 12-05-2006 à 18:07:59    

Hello !
 
Après avoir pratiquement bien torché mon site sous IE, j'installe Firefox pour voir ce que ça donne, et là c'est la cata complète :D
J'ai déjà corrigé quelques trucs, mais j'bloque sur un problème de lien.
Je demande à ce que les liens soient soulignés. A plusieurs endroits de ma page html je fais des ancrages. Sous IE ces ancrages ne sont pas soulignés lorsque l'on passe dessus (c'est ce que je veux), hors sous Firefox ils le sont. C'est normal ? Comment j'peux régler le problème de façon propre ? (c'est à dire en mettant autre chose que du vide entre les balises <a> et </a> )
 
Le code html :
 

Code :
  1. <p><a name="comment194">Ajouc ommentaire<br /></a></p>


 
le code css :

Code :
  1. #comment a:hover
  2. {
  3. text-decoration:underline;
  4. }


 
%erci !

Reply

Marsh Posté le 12-05-2006 à 18:07:59   

Reply

Marsh Posté le 12-05-2006 à 18:08:56    

id a la place de name.
 
edit: mais dans ta css tu demandes à ce qu'ils le soient  [:pingouino]


Message édité par anapajari le 12-05-2006 à 18:09:37
Reply

Marsh Posté le 12-05-2006 à 18:12:48    

ah, SELFHTML serait à la ramasse ? Ils disent de foutre des "name" :??:
 
Oui, mais je voulais que seuls les liens du style href soient soulignés, pas les ancrages. IE gère bien ce truc, il ne me souligne que les href, pas le reste, alors que Firefox souligne tout ce qu'il trouve :D

Message cité 1 fois
Reply

Marsh Posté le 12-05-2006 à 18:26:27    

godbout a écrit :

ah, SELFHTML serait à la ramasse ? Ils disent de foutre des "name" :??:


Ils ont raison pour les ancrages, mais si tu utilises # dans un css c'est pour "pointer" sur l'element qui porte cet id
http://www.w3.org/TR/1999/REC-CSS1 [...] s-selector ;)
 
 

godbout a écrit :

Oui, mais je voulais que seuls les liens du style href soient soulignés, pas les ancrages. IE gère bien ce truc, il ne me souligne que les href, pas le reste, alors que Firefox souligne tout ce qu'il trouve :D


quoi qu'il en soit je te conseillerais de faire un class "spécifique" pour les ancrages.
tu gardes ta définition globale sur les a

Code :
  1. a{
  2. text-decoration: none;
  3. }
  4. a:hover{
  5. text-decoration: underline;
  6. }


tu rajoutes une spécificité hover pour class "ancrage"

Code :
  1. a.ancrage:hover{
  2. text-decoration: none;
  3. }


Et tu oublies pas d'ajouter la class dans tes ancrages

Code :
  1. <a name="pouet" class="ancrage>A</a>


Et roulez jeunesse!

Message cité 4 fois
Reply

Marsh Posté le 12-05-2006 à 18:33:15    

anapajari a écrit :

Ils ont raison pour les ancrages


Même pas, les navigateurs modernes gèrent parfaitement les ids pour les ancres, ce qui permet entre autres de ne pas être limité à des ancres-liens (n'importe quel élément peut devenir une ancre).
 
Ya ptet que NS4 qui le gère pas, et encore j'en suis pas sûr.
 
Le seul endroit ou name peut encore être utilisé ce sont les formulaires.

Message cité 1 fois

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
Reply

Marsh Posté le 12-05-2006 à 19:14:29    

anapajari a écrit :

Ils ont raison pour les ancrages, mais si tu utilises # dans un css c'est pour "pointer" sur l'element qui porte cet id
http://www.w3.org/TR/1999/REC-CSS1 [...] s-selector ;)


Euh, ok. J'suis un peu perdu du coup là mais c'est pas grave, j'vais lire ça :D
 

anapajari a écrit :


quoi qu'il en soit je te conseillerais de faire un class "spécifique" pour les ancrages.
tu gardes ta définition globale sur les a

Code :
  1. a{
  2. text-decoration: none;
  3. }
  4. a:hover{
  5. text-decoration: underline;
  6. }


tu rajoutes une spécificité hover pour class "ancrage"

Code :
  1. a.ancrage:hover{
  2. text-decoration: none;
  3. }


Et tu oublies pas d'ajouter la class dans tes ancrages

Code :
  1. <a name="pouet" class="ancrage>A</a>


Et roulez jeunesse!


Impec, j'vais faire ça [:ocube]
 
J'penserais pas que ce serait autant la misère par contre pour gérer au moins ie et firefox. Tout fout le camp, mes height en %, mes width, plein de trucs quoi :D

Reply

Marsh Posté le 12-05-2006 à 19:14:53    

masklinn a écrit :

Même pas, les navigateurs modernes gèrent parfaitement les ids pour les ancres, ce qui permet entre autres de ne pas être limité à des ancres-liens (n'importe quel élément peut devenir une ancre).
 
Ya ptet que NS4 qui le gère pas, et encore j'en suis pas sûr.
 
Le seul endroit ou name peut encore être utilisé ce sont les formulaires.


Ok, je prends note merci :jap:

Reply

Marsh Posté le 12-05-2006 à 23:25:40    

anapajari a écrit :

Ils ont raison pour les ancrages, mais si tu utilises # dans un css c'est pour "pointer" sur l'element qui porte cet id
http://www.w3.org/TR/1999/REC-CSS1 [...] s-selector ;)
 
 
 
quoi qu'il en soit je te conseillerais de faire un class "spécifique" pour les ancrages.
tu gardes ta définition globale sur les a

Code :
  1. a{
  2. text-decoration: none;
  3. }
  4. a:hover{
  5. text-decoration: underline;
  6. }


tu rajoutes une spécificité hover pour class "ancrage"

Code :
  1. a.ancrage:hover{
  2. text-decoration: none;
  3. }


Et tu oublies pas d'ajouter la class dans tes ancrages

Code :
  1. <a name="pouet" class="ancrage>A</a>


Et roulez jeunesse!


 
Pareil, mais avec le guillemet manquant  [:angefox]


---------------
Mains power can kill, and it will hurt the entire time you’re dying from it.
Reply

Marsh Posté le 13-05-2006 à 01:11:49    

anapajari a écrit :


quoi qu'il en soit je te conseillerais de faire un class "spécifique" pour les ancrages.
tu gardes ta définition globale sur les a

Code :
  1. a{
  2. text-decoration: none;
  3. }
  4. a:hover{
  5. text-decoration: underline;
  6. }


tu rajoutes une spécificité hover pour class "ancrage"

Code :
  1. a.ancrage:hover{
  2. text-decoration: none;
  3. }


Et tu oublies pas d'ajouter la class dans tes ancrages

Code :
  1. <a name="pouet" class="ancrage>A</a>


Et roulez jeunesse!


Bon, je sais pas si c'est parce que je suis fatigué ou pas, mais j'capte rien et ça commence sérieusement à me saouler :mad:
J'ai réussi à faire un truc, mais pas encore exactement ce que je voulais.
 
J'ai d'abord écrit ça :

Code :
  1. a.anchor:hover
  2. {
  3. text-decoration:none;
  4. }


Si j'me trompe pas, toutes les balises <a class="anchor"> devraient répondre à ce traitement.
Hors, quand je teste sur celles qui sont contenues dans une <div class="comment">, ça ne marche pas.
 
Du coup j'ai tapé ça :

Code :
  1. #comment a.anchor:hover
  2. {
  3. text-decoration:none;
  4. }


Maintenant ça marche bien dans ma <div class="comment">, mais forcément, ça marche pas dans le reste :mad:
 
J'y comprends plus rien.

Message cité 1 fois
Reply

Marsh Posté le 13-05-2006 à 01:20:52    

Bon, à mon avis c'est un problème de priorité en fait. Le dernier truc à être appliqué, c'est celui qui concerne #comment. J'ai donc capté pourquoi ça marche pas, j'vais pouvoir dormir à peu près tranquillement :o

Reply

Marsh Posté le 13-05-2006 à 01:20:52   

Reply

Marsh Posté le 14-05-2006 à 15:36:39    

tu as un div qui a une class, donc utilise le . et pas le # !!!

Code :
  1. .comment a.anchor:hover

Reply

Marsh Posté le 14-05-2006 à 15:40:21    

Non non, ma div a bien un id et non une classe :D

Reply

Marsh Posté le 15-05-2006 à 09:23:04    

godbout a écrit :


Du coup j'ai tapé ça :

Code :
  1. #comment a.anchor:hover
  2. {
  3. text-decoration:none;
  4. }


Maintenant ça marche bien dans ma <div class="comment">, mais forcément, ça marche pas dans le reste :mad:
 
J'y comprends plus rien.


:o

Reply

Marsh Posté le 15-05-2006 à 12:14:52    

Désolé, c'était donc <div id="comment"> qu'il fallait évidemment lire :whistle:

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed