Bonjour.
Il faut refléchir... Et connaître un peu les propriétés de ce qu'on utilise.
En l'occurence :
- ton "fond gris" s'applique à ton DIV bt_lien1
- Le rollover s'applique à ton lien.
Connaissance des propriétés :
Là, il faut comprendre la différence entre les éléments "block" et les éléments "inline".
Par défaut, la balise DIV définit un bloc. Sa longueur, si elle n'est pas déterminée dans le CSS, est le maximum possible.
Par défaut, la balise A définit un élément "inline". Sa longueur est donc exactement celle du texte qui est dedans.
=> Le lien est "plus petit" que le "bouton".
=> Solution : définir le lien comme un bloc.
Code :
#conteneur_menu a { font-size:11px; text-decoration:none; color: #000000; font-weight:bold; display:block; }
|
Et puis c'est mon jour de bonté...
1. Il y a un </div> de trop.
Mon conseil : pense à faire un code bien indenté, tu t'y retrouveras mieux. Par exemple :
Code :
<div id="conteneur_menu"> <div id="bt_lien1"> <div class="lien1"> <a href="">lien1 </a> </div> </div> </div>
|
(au passage, si tu clique sur le bouton tu noteras que j'ai mis mon code dans une balise qui permet de le présenter)
2. N'utiliser les DIV qu'en dernier ressort.
C'est à dire, tant que tu peux trouver un balisage significatif, utilise-le. Les DIV (comme leur pendant "inline" les SPAN) ne doivent être utilisés que si on ne peut rien trouver d'autre.
En l'occurence, un menu n'est rien d'autre qu'une liste de liens.
=> Utilise une liste, et mets la en forme avec le CSS.
2. Moins on en fait, mieux c'est... Pourquoi utilises-tu autant de DIV ?
Un principe de base qui te sera très utile : A partir du moment où un DIV ne contient qu'un objet, c'est qu'il n'est pas nécessaire !