Bonjour à tous,
voilà j'essaie de me mettre au xHTML et CSS en suivant les cours de www.siteduzero.com
Mais je bloque sur la creation de mon menu
Donc voilà mon fichier HTML : (juste la partie correspondant au menu !)
Citation :
<div id ="menu_gauche">
<div class="sous_menu_gauche">
<h3>AQUARIOPHILIE</h3>
<ul>
<li><a href="page1.html">Bien débuter</a></li>
</ul>
</div>
<div class="sous_menu_gauche">
<h3>PHOTOS</h3>
<ul>
<li><a href="clara-08-2005.html">Août 2005</a></li>
<li><a href="clara-08-2005.html">Septembre 2005</a></li>
<li><a href="clara-08-2005.html">Octobre 2005</a></li>
</ul>
</div>
</div>
|
Jusque là tout va bien.
Avec un logiciel de dessin, j'ai crée un bitmap de 231px par 30px qui représente le haut de mon menu dans lequel s'écrit ce qu'il y a dans h3 (donc les titres de mes sous-menu)
la partie de mon css correspondant est
Citation :
.sous_menu_gauche h3
{
width:231px;
height:30px; padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
padding-left: 20px;
background-image: url("images/menu_gauche_haut.png" );
background-repeat: no-repeat;
}
|
Toujours avec mon logiciel de dessin j'ai crée un bitmap que je voudrais insérer à chaqua lien <li> (c'est un bitmap représentant les bors du menu)
La partie CSS est
Citation :
.sous_menu_gauche li
{
width:231px;
height:21px;
padding: 0px; /* Tous les côtés ont une marge intérieure de 0 pixels */
padding-left: 0px;
background-image: url("images/menu_gauche_milieu.png" );
background-repeat: no-repeat;
}
|
Mais le pb c'est que mon image est décalé, et donc ne colle pas avec celle affiché avec h3 (décalage de 40 ou 50 px sur la droite)
Donc quelqu'un pourrait-il m'expliquer comment résoudre ce pb ?
Voilà. Merci bp.
Je ne sais pas si j'ai été très clair