[Résolu] Zone cliquable sur <li>...

Bonsoir,

tout d'abord un grand bravo aux acteurs de cette communauté, ça faisait trés trés longtemps que j'vous lisait et cette fois-ci j'ai decidé de sauter le pas

Mais ma venue ici n'est pas sans but, j'ai besoin de votre aide

Mieux que des mots, une image :
http://www.zyente.fr/_perso/bugMenu.jpg

Comme vous pouvez le voir sur l'image, la zone "cliquable" (que j'ai volontairement entouré en rouge) sur l'item de mon menu ne recouvre pas entièrement celui-ci

J'voulais donc savoir, au vue de mon code ci-dessous, si vous aviez une idée pour remédier à cela...

HTML :

<div id="menu">
  <ul class="menu">
    <li><a href="/index.php">Accueil</a></li>
    <li><a href="/front/infos.php">Infos</a></li>
    <li><a href="/front/travaux.php">Mes Travaux</a></li>
  </ul>
</div>

CSS :

#menu ul { 
margin:0;
padding:0;
list-style-type:none; }

.menu li {
margin-bottom:5px;
padding-left:5px;
border:1px solid #999; }

.menu li:hover {
background-color:#FFC;
border-color:#FC9; }

.menu a {
width:99px;
display:block;
color:#69C;
text-decoration:none;
border:1px solid red;
margin:0 2px; }

.menu a:hover { 
color: #2B6096;
text-decoration:none; }

Merci.


P(H)S : Dommage qu'il n'y ait l'option prévisualiser pour les messages.
Modifié par Zyente (08 Jan 2007 - 21:23)

Bienvenue à toi,
Tu as un padding-left de 5px sur tes li qu'il faudrait que tu transfers
vers .menu a et comme cette valeur s'ajoute a la largeur du lien,
tu dois réduir ton width à 94px.
Modifié par Hermann (08 Jan 2007 - 21:12)

Génial, ça marche..

Merci pour la réponse rapide !