Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1060 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Les balises lien <a> et les retour à la ligne

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Les balises lien <a> et les retour à la ligne

n°1145262
Immortal-P​C
Posté le 09-07-2005 à 22:54:35  profilanswer
 

Salut à tous,
Alors j'ai un méga problème j'aimerai faire un menu horizontal sans <table>
Et Mes lien doivent avoir une image en fond ( width: 133px; height: 25px; )
et la c'est beacoup plus chaud !!!!
Voici mon menu :

<div id="menu"><a href="./" title="Accueil">Accueil</a><a href="" title="Vente">Vente</a><a href="" title="">Location</a><a href="" title="Assurance">Assurance</a><a href="" title="Partenaires">Partenaires</a><a href="?ID=contact" title="Contact">Contact</a></div>

 
Mon style CSS :

#menu {
    background-color:#C9CDFF;
}
#menu a {
    display: block;
    font-weight: bolder;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bolder;
    font-size: 14pt;
    color: #4E517C;
    width: 133px;
    height: 25px;
    background: url("./images/menu_off.jpg" );
    text-align: center;
    text-decoration:none;
 
}
#menu a:hover {
    display: block;
    color: #000000;
    width: 133px;
    height: 25px ;
    background-image: url("./images/menu_on.jpg" );
    text-align: center;
    text-decoration:none;
}

 
Et j'ai des retour à la ligne pour chaque balise <a> :fou:  :cry:  :pt1cable: !!!!!
Merci beaucoup à ceux qui prendront le temps de lire ce message.
@+


---------------
Immortal-PC,
mood
Publicité
Posté le 09-07-2005 à 22:54:35  profilanswer
 

n°1145276
antp
Super Administrateur
Champion des excuses bidons
Posté le 09-07-2005 à 23:20:38  profilanswer
 

Parce que t'as mis "display: block" et que les blocs se mettent les uns en dessous des autres.
Essaie d'ajouter "float: left"


Message édité par antp le 09-07-2005 à 23:21:21

---------------
mes programmes ·· les voitures dans les films ·· apprenez à écrire
n°1145290
alaindeloi​n69
Posté le 10-07-2005 à 00:18:27  profilanswer
 

comme les listes sont très apropriés pour les menu, utilise une liste, prend bien soin de mettre float: left; ou display inline dans le code CSS
 

Code :
  1. #menu ul li {
  2. float: left;
  3.             }


 
et met dans ton code html :
 

Code :
  1. <ul id="menu">
  2. <li><a href="#">accueil</a></li>
  3. <li><a href="#">ventes</a></li>
  4. ..............................
  5. </ul>


 
je pense que c'est mieu ciao

n°1145789
Immortal-P​C
Posté le 10-07-2005 à 22:22:28  profilanswer
 

Salut,
MERCI beaucoup les gars c'est nikel !!!!!!!
Pour ceux que ça intéresse voici le code :
Les CSS :

Code :
  1. #menu {
  2.     list-style: none;
  3.     display: inline;
  4.     background-color:#C9CDFF;
  5. }
  6. #menu li {
  7.     float: left;
  8. }
  9. #menu a {
  10.     display: block;
  11.     /*white-space: nowrap;*/
  12. font-weight: bolder;
  13.     font-family: Arial, Helvetica, sans-serif;
  14. font-weight: bolder;
  15.     font-size: 14pt;
  16.     color: #4E517C;
  17.     width: 133px;
  18.     height: 25px;
  19.     background: url("./images/menu_off.jpg" );
  20. text-align: center;
  21.     text-decoration:none;
  22. }
  23. #menu a:hover {
  24. display: block;
  25.     color: #000000;
  26.     width: 133px;
  27.     height: 25px ;
  28.     background-image: url("./images/menu_on.jpg" );
  29. text-align: center;
  30.     text-decoration:none;
  31. }


 
Le HTML :

Code :
  1. <ul id="menu">
  2. <li><a href="./" title="Accueil">Accueil</a></li>
  3. <li><a href="" title="Vente">Vente</a></li>
  4. <li><a href="" title="">Location</a></li>
  5. <li><a href="" title="Assurance">Assurance</a></li>
  6. <li><a href="" title="Partenaires">Partenaires</a></li>
  7. <li><a href="?ID=contact" title="Contact">Contact</a></li>
  8. </ul>


 
@+ et encore merci !!!! :jap:  :sol:  :hello:  :bounce:


---------------
Immortal-PC,
n°1148413
alaindeloi​n69
Posté le 12-07-2005 à 21:56:11  profilanswer
 

de rien, c'est une dès premiere fois que je reponds a une personne et qur je sers vraiment a quelque chose :D, d'habitude, c' est moi qui pose des questions ..... ciao @+


---------------
mon site perso, allez visiter

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Les balises lien <a> et les retour à la ligne

 

Sujets relatifs
problème de lien dans une pop up[Struts] Popup et retour
[ JEXCEL/JXL] Récupération d'un lien hypertexte dans un cellulelien vers disque
Problème de lien css et firefox comment eviter les sauts a la ligne
Access - lien dynamique "décroisé" Excel-Access[php] Enlever les balises html d'une chaine de caractère
Probleme lienEnvoyez un formulaire +ouvrir lien en cliquant sur une image [sans JS]
Plus de sujets relatifs à : Les balises lien <a> et les retour à la ligne


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR