Menu en DIV (id ou class ?)

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Menu en DIV (id ou class ?)

Odissine

Bonjour à tous,
Je remet un peu à jour certains de mes sites (qui étaient avec des <table> ) pour les mettres à jour en DIV... Seulement voilà, je suis un peu paumé ...
Je voudrais faire un menu tout simple (Accueil, Nos Collections) avec un systeme de RollOver sur ces boutons ...

J'avais commencé mes css comme ci-dessous :

Code :

#navbar{
width:auto;
display:block;
height:19px;
padding-left:125px;
border-top-width: 1px;
border-bottom-width: 1px;
border-top-style: solid;
border-bottom-style: solid;
border-top-color: #A7AFB1;
border-bottom-color: #A7AFB1;
}
#nav01 a:link {
font-family:Verdana, Geneva, sans-serif;
font-size:11px;
text-align:center;
text-decoration:none;
color:#CCC;
display:block;
position:relative;
top:2px;
left:2px;
width:100px;
height:15px;
}
#nav01 a:hover {
font-family:Verdana, Geneva, sans-serif;
font-size:11px;
text-decoration:none;
color:#CCC;
display:block;
width:100px;
height:15px;
border: 1px solid #A7AFB1;
position:relative;
top:1px;
left:1px;
text-align:center;
background-color:#333;
}
#nav02 a:link {
font-family:Verdana, Geneva, sans-serif;
font-size:11px;
text-align:center;
text-decoration:none;
color:#CCC;
display:block;
position:relative;
top:1px;
left:107px;
width:150px;
height:15px;
}
#nav02 a:hover {
font-family:Verdana, Geneva, sans-serif;
font-size:11px;
text-decoration:none;
color:#CCC;
display:block;
width:150px;
height:15px;
border: 1px solid #A7AFB1;
position:relative;
top:1px;
left:106px;
text-align:center;
background-color:#333;
}

Mon probleme est qu'un décalage s'opère entre Accueil et le reste (dans l'ex ci-dessous seul deux rubriques sont dispo ... mais j'ai encore 4 autres rubriques a mettre dans le menu ...

En clair donc j'aimerais faire un menu avec chaque rubriques qui aurait une largeur distincte, mais bordure et couleur de fond en survol identique ...

Merci pour votre aide !

Bonne Journée

Publicité

kurt11

Bonjour,

Citation :

CSS : CSS (Cascading Style Sheets : feuilles de style en cascade) est un langage informatique...

Cela veut dire que si tu mets une couleur verte à <p> alors toutes tes balises <p> auront une couleur de texte verte par défaut.

Cela permet aussi d'écrire beaucoup moins de code pour la même chose. Par exemple :

Code :

leNomDeTaBalise [id^="nav0"] {
font-family:Verdana, Geneva, sans-serif;
font-size:11px;
text-align:center;
text-decoration:none;
color:#CCC;
display:block;
}

Ce code te permettra d'avoir les mêmes balise dont l'id commence par "nav0"

Ensuite pour ton souci, si ta #navbar est une <ul> et tes "nav0" des <li> ajoute un "float : left" à #navbar et supprime ces "position : relative" aux "nav0"

Un lien vers le site ou le code html de la section sera pas mal si tu veux plus d'aide.

Message édité par kurt11 le 23-03-2009 à 09:23:42

FORUM HardWare.fr

Programmation

HTML/CSS

Menu en DIV (id ou class ?)

Sujets relatifs
Insertion de text et Jcombobox dans un menu a onglet	creation menu en VBA ??
Espace sous Div avec IE7	Comment ne charger qu'un DIV en cliquant sur un lien du menu ?
probleme pour menu déroulant	Verifier champs par class
[Résolu] [PHP] Pb : appels d'un menu avec la fonction include	Question menu accordeon Jquery
Menu accordéon Spry ne fonctionne pas sous Firefox
Plus de sujets relatifs à : Menu en DIV (id ou class ?)

Page générée en 0.036 secondes