par
ratdelabo » 12 mars 2006, 18:17
Bonjour à tous,
Je cherche à centrer verticalement mes <li> du menu gauche, sans que chaque <li> soit exagéremment éloignées les unes des autres à cause du padding-top.
Voici mon code html:
<div id="gauche">
<ul class="menugauche">
<li><a href="http://ratdelabo57.free.fr/gestclasse/index.php?page=cahier_texte&classe=6°%20Techno4">- 6ème gpe 4 -</a></li>
<li><a href="http://ratdelabo57.free.fr/gestclasse/index.php?page=cahier_texte&classe=6°%20Techno5">- 6ème gpe 5 -</a></li>
<li><a href="http://ratdelabo57.free.fr/gestclasse/index.php?page=cahier_texte&classe=6°%20Techno6">- 6ème gpe 6 -</a></li>
<li><a href="http://ratdelabo57.free.fr/gestclasse/index.php?page=cahier_texte&classe=5°%203">- 5ème 3 -</a></li>
<li><a href="http://ratdelabo57.free.fr/gestclasse/index.php?page=cahier_texte&classe=5°6">- 5ème 6 -</a></li>
</ul>
<div class="pub">
<div class="google">
<script type="text/javascript"src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
</div>
</div>
Et le css associé:
#gauche {
float:left;
left:0;
width: 162px;
}
.menugauche {
list-style-type: none;
background-image:url(images/gestclasse.gif);
height:380px;
text-align:center;
}
.menugauche li{
padding-top:53px;
}
Lorsque j'applique un tout bête "margin-bottom" à mes <li>, je décale le menu d'autant de pixels, sous Fx. Voilà pourquoi je cherche une autre solution.
Merci pour votre avis
Edité le 13/03/06:Bon le probleme est résolu.
Pour ceux que ça intéresse, c'était tout bête...
J'ai mis un padding-top sur le div <ul> et diminué son height d'autant...Ce qui posait problème c'est que l'ul avait une image de fond qui avait une hauteur à respecter, j'avais donc mis une height équivalente. Lorsque je mettais un padding, la div du dessous s'éloignait d'autant (logique)...
Enfin voilou, tout con.
Bonjour à tous,
Je cherche à centrer verticalement mes <li> du menu gauche, sans que chaque <li> soit exagéremment éloignées les unes des autres à cause du padding-top.
Voici mon code html:
[php]
<div id="gauche">
<ul class="menugauche">
<li><a href="http://ratdelabo57.free.fr/gestclasse/index.php?page=cahier_texte&classe=6°%20Techno4">- 6ème gpe 4 -</a></li>
<li><a href="http://ratdelabo57.free.fr/gestclasse/index.php?page=cahier_texte&classe=6°%20Techno5">- 6ème gpe 5 -</a></li>
<li><a href="http://ratdelabo57.free.fr/gestclasse/index.php?page=cahier_texte&classe=6°%20Techno6">- 6ème gpe 6 -</a></li>
<li><a href="http://ratdelabo57.free.fr/gestclasse/index.php?page=cahier_texte&classe=5°%203">- 5ème 3 -</a></li>
<li><a href="http://ratdelabo57.free.fr/gestclasse/index.php?page=cahier_texte&classe=5°6">- 5ème 6 -</a></li>
</ul>
<div class="pub">
<div class="google">
<script type="text/javascript"src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
</div>
</div>
[/php]
Et le css associé:
[php]
#gauche {
float:left;
left:0;
width: 162px;
}
.menugauche {
list-style-type: none;
background-image:url(images/gestclasse.gif);
height:380px;
text-align:center;
}
.menugauche li{
padding-top:53px;
}
[/php]
Lorsque j'applique un tout bête "margin-bottom" à mes <li>, je décale le menu d'autant de pixels, sous Fx. Voilà pourquoi je cherche une autre solution.
Merci pour votre avis :wink:
[color=blue]Edité le 13/03/06:Bon le probleme est résolu.
Pour ceux que ça intéresse, c'était tout bête...
J'ai mis un padding-top sur le div <ul> et diminué son height d'autant...Ce qui posait problème c'est que l'ul avait une image de fond qui avait une hauteur à respecter, j'avais donc mis une height équivalente. Lorsque je mettais un padding, la div du dessous s'éloignait d'autant (logique)...
Enfin voilou, tout con. [/color]