liens qui marchent pas...

liens qui marchent pas... - HTML/CSS - Programmation

Marsh Posté le 17-07-2005 à 20:18:08    

Salut à tous.
 
J'ai commencé un site j'ai un souci de taille : les liens ne marchent pas ! Plus précisément, les images qui servent de liens dans mon menu ne fonctionnent pas.  :pt1cable:  
J'ai pourtant déjà fait ce genre de choses (qui marchent) mais là... Comme je ne trouve pas le problème, je vus demande de l'aide !  :??:  
 
Voici le code html : (je ne mets que ce qui me semble utile, cad le menu)

Code :
  1. <div class="menu">
  2.       <ul id="menuG">
  3.         <li><a href="index.html" id="accueil"></a></li>
  4.         <li><a href="plan.html" id="plan"></a></li>
  5.         <li><a id="galeries"></a></li>
  6.         <li><a id="tests"></a></li>
  7.         <li><a id="forum"></a></li>
  8.         <li><a id="liens"></a></li>
  9.         <li><a id="contacts"></a></li>
  10.       </ul>
  11.   </div>

et le CSS associé :

Code :
  1. .menu {
  2. margin: 0px 5px 0px 2px;
  3. width : 873px;
  4. height: 96px;
  5. background-image: url(images/menu.png);
  6. border: 1px solid transparent;
  7. }
  9. /* Partie gauche */
  10. ul#menuG {
  11. margin-left: 0px;
  12. margin-top: 0px;
  13. list-style-type: none;
  14. }
  16. ul#menuG li a {
  17. float: left;
  18. width: 99px;
  19. height: 20px;
  20. margin-right: 0px;
  21. border: 1px solid #FFFF00;
  22. }
  23. ul#menuG li a#accueil {
  24. background-image: url(images/menu/accueil.png);
  25. background-repeat:no-repeat;
  26. margin-top: 59px;
  27. }
  28. ul#menuG li a#accueil:hover {
  29. background-image: url(images/menu/plan.png);
  30. background-repeat:no-repeat;
  31. margin-top: 59px;
  32. }
  34. ul#menuG li a#plan {
  35. background-image: url(images/menu/plan.png);
  36. background-repeat:no-repeat;
  37. margin-top: 60px;
  38. }
  40. /* Partie droite */
  41. ul#menuG li a#galeries {
  42. background-image: url(images/menu/galeres.png);
  43. background-repeat:no-repeat;
  44. margin-left: 100px;
  45. margin-top: 19px;
  46. }
  47. ul#menuG li a#tests {
  48. background-image: url(images/menu/tests.png);
  49. background-repeat:no-repeat;
  50. margin-top: 20px;
  51. }
  52. ul#menuG li a#forum {
  53. background-image: url(images/menu/forum.png);
  54. background-repeat:no-repeat;
  55. margin-top: 19px;
  56. }
  57. ul#menuG li a#liens {
  58. background-image: url(images/menu/liens.png);
  59. background-repeat:no-repeat;
  60. margin-top: 17px;
  61. }
  62. ul#menuG li a#contacts {
  63. background-image: url(images/menu/contacts.png);
  64. background-repeat:no-repeat;
  65. margin-top: 15px;
  66. }


 
Merci d'avance !  :bounce:

Reply

Marsh Posté le 17-07-2005 à 20:18:08   

Reply

Marsh Posté le 17-07-2005 à 20:50:35    

Vérifie si le chemin vers tes images est bon. Aucunne ne fonctionne ?

Reply

Marsh Posté le 17-07-2005 à 20:51:01    

Gaffe, le chemin des images doit être relatif au fichier CSS, donc si t'as tes CSS dans /style/ et tes images dans /images/, chercher "images/blabla" dans ton CSS va tenter de trouver l'image "/style/images/blabla".


---------------
I Was Here
Reply

Marsh Posté le 17-07-2005 à 20:52:36    

Le probleme ne vient pas des chemins vu que toutes les images s'affichent. C'est juste que les liens sont inactifs. Nej fait, y'a même pas de liens apparement (la souris ne change pas de "tête" ). J'ai fait un teste en ajoutant le a#accueil:hover et rien...

Reply

Marsh Posté le 17-07-2005 à 20:54:21    

Ben normalement avec ton truc seuls les mots du lien sont actifs, pas ce qu'il y a autour [:spamafote]


---------------
I Was Here
Reply

Marsh Posté le 17-07-2005 à 20:55:33    

Peut-être car qu'il te manque des href="..." dans tes liens.

Reply

Marsh Posté le 17-07-2005 à 20:56:32    

oui je sais, je n'ai fait des tests que sur les premiers et même eux ne marchent pas... :(

Reply

Marsh Posté le 17-07-2005 à 20:57:55    

Elles sont où tes images ? (Pour t'aider c'est mieux)

Reply

Marsh Posté le 17-07-2005 à 21:14:05    

là où il faut ;)
J'ai index.html à la racinde de public_html. Un repertoire images avec mes images et un sous repertoire dans images qui s'apelle menu er qui contient les images qui posent pb en ne faisant pas de lien. :)

Reply

Marsh Posté le 17-07-2005 à 21:22:20    

Mais le "problème", c'est que ton code fonctionne quand je met des images perso.

Reply

Marsh Posté le 17-07-2005 à 21:22:20   

Reply

Marsh Posté le 17-07-2005 à 21:41:52    

donc c'est ce que je craignais, ça viert surement de mon ordi.  
Je suis persuadé qu'en redémarrant ça marchera :D
 
Bah en fait non. Quand tu dis que çamarche, tu veux direquoi exactement ? Parce quoi moi, actuellement, les images s'affichent mais ne servent pas de lien.
 
Je met le reste de la page html pour que vous voyez...

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2.         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
  4. <head>
  5. <meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" />
  6. <title>Bienvenue</title>
  7. <link href="brouillon.css" rel="stylesheet" type="text/css" />
  8. </head>
  9. <body>
  10. <div class="global">
  11.   <div class="menu">
  12.       <ul id="menuG">
  13.         <li><a href="index.html" id="accueil"></a></li>
  14.         <li><a href="plan.html" id="plan"></a></li>
  15.         <li><a id="galeries"></a></li>
  16.         <li><a id="tests"></a></li>
  17.         <li><a id="forum"></a></li>
  18.         <li><a id="liens"></a></li>
  19.         <li><a id="contacts"></a></li>
  20.       </ul>
  21.   </div>
  22.   <div class="dessous">
  23.     <div class="cadreGauche">
  24.       <ul id="gauche">
  25.         <li><a id="un"></a></li>
  26.         <li><a id="deux"></a></li>
  27.         <li><a id="trois"></a></li>
  28.         <li><a id="quatre"></a></li>
  29.       </ul>
  30.     </div>
  31.     <div class="contenu"></div>
  32.   </div>
  33. </div>
  34. </body>
  35. </html>


Message édité par Papy Brossard le 17-07-2005 à 21:49:41
Reply

Marsh Posté le 17-07-2005 à 21:59:05    

Avec quel(s) navigateur(s) tu testes ?
 
Si tu laisses un espace dans les liens, est-ce que ça marche mieux ? (comme ça : <a ...> </a> )


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Marsh Posté le 17-07-2005 à 22:00:21    

Ceci dit, laisser les liens vides n'est pas du tout accessible : ceux qui ont un navigateur textuel/auditif (aveugles, etc...) ne pourront jamais utiliser les liens. Donc il faut quand même mettre du texte dedans, mais ne pas l'afficher (avec les CSS)


Message édité par gm_superstar le 17-07-2005 à 22:00:43

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Marsh Posté le 17-07-2005 à 22:21:02    

Pour qu'elles servent de lien, il faut inclure un href=""  dans tes balises sinon il s'agit d'une juste d'une ancre (Je crois que ça s'écrit comme ça).

Reply

Marsh Posté le 17-07-2005 à 23:22:28    

je sais tout ça. Mais comment expliquez vous que les deux premieres images ne marchent pas non plus ? J'ai pas pris la peine de tout remplir pour le moment, c'est tout.... :)
JKe teste avec FF et IE. Et non j'ai pas testé avec un espace mais j'ai déjà fait ce genre de liens et ils fonctionnaient parfaitement (sans espace).


Message édité par Papy Brossard le 17-07-2005 à 23:23:19
Reply

Marsh Posté le 17-07-2005 à 23:26:46    

Un lien se comportera en lien si tu met un href. Si tu n'en met pas, il ne se comportera pas en lien.
 
---
 
Prend une image au hasard sur le net, met la en fond à la place de tes images et vois si ça fonctionne. J'ai entamé cette démarche pour tester ton code, et ça a fonctionné...

Reply

Marsh Posté le 17-07-2005 à 23:31:44    

Reply

Marsh Posté le 17-07-2005 à 23:57:14    

comment ça, un lien pour tester ?

Reply

Marsh Posté le 17-07-2005 à 23:59:29    

Bah si tes pages sont en ligne, tu as bien un URL pour y accéder, et donc à nous donner pour voir le problème en vrai de vrai !

Reply

Marsh Posté le 18-07-2005 à 00:03:06    

lien :)


Message édité par Papy Brossard le 13-12-2007 à 13:35:13
Reply

Marsh Posté le 18-07-2005 à 00:14:41    

Où est le problème? les images s'affichent.

Reply

Marsh Posté le 18-07-2005 à 00:28:06    

C'est ton cadre en position absolue (.dessous) qui fout le bordel.


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Marsh Posté le 18-07-2005 à 08:24:25    

merci gm_superstar. Et comment je résous le pb ? d'ailleurs, pourquoi ça pose un pb ?
Merci ! :)
 
edit : Effectivement, je viens d'essayer de mettre un lien là où es div ne se superposent pas et ça foncionne... Qqn saurait comment résoudre le pb (qui devient donc "faire d'une background-image un lien alors qu'elle est dans un div mais qu'un autre div le superspose). Cf dessin.
http://img232.imageshack.us/img232/2466/lien5wp.gif


Message édité par Papy Brossard le 18-07-2005 à 08:39:38
Reply

Marsh Posté le 18-07-2005 à 20:13:37    

Ben il suffit que les 2 DIV ne se superposent pas... Commence déjà par ne pas utiliser le positionnement absolu (c'est pas indispensable dans ton cas)


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Marsh Posté le 19-07-2005 à 10:29:55    

je mets quoi en remplacement de absolut ?
J'ai déjà "désupersposé" les deux divs :)

Reply

Marsh Posté le 19-07-2005 à 22:27:24    

Ben non tu mets rien, tu laisses .dessous dans le flux normal. Il ira se mettre en dessous de .menu
 
Si tu as besoin d'ajuster leur position en hauteur, joue plutôt sur les marges.


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

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