SVP mon Menu ne veux pas que j'améliore code
gauzhelm
Messages postés
40
Statut
Membre
-
dreamfeeder Messages postés 253 Statut Membre -
dreamfeeder Messages postés 253 Statut Membre -
Bonjour,
Pour améliorer mon code, Je veux remplacer cela :
Par cela :
Et donc, j'adapte mon CSS en conséquence en suprimant les " ul "
mais mon Menu se transforme en liste verticale, pourquoi donc ?
Quelle gentille et géniale personne veut bien m'éclairer SVP ?
Pour améliorer mon code, Je veux remplacer cela :
<div class="sidebar">
<ul>
<li><a href="../index.php">Index</a></li>
<li><a href="../accueil/accueil.php">Accueil</a></li>
<li><a href="../images/parcours.php">Parcours</a></li>
<li><a href="../a-crayons/index.html">Crayon</a></li>
</ul>
Par cela :
<ul class="sidebar">
<li><a href="../index.php">1-Index</a></li>
<li><a href="../accueil/accueil.php">2-Accueil</a></li>
<li><a href="../images/parcours.php">3-Parcours</a></li>
</ul>
Et donc, j'adapte mon CSS en conséquence en suprimant les " ul "
mais mon Menu se transforme en liste verticale, pourquoi donc ?
.sidebar
{
text-align:center;
margin: auto;
width:770px;
}
.sidebar ul
{
list-style-type:none; /* Suppression des puces du <ul> */
margin: auto;
}
.sidebar li
{
display:inline;
line-height:34px;
}
.sidebar ul a
{
margin: auto;
padding: 3px 9px;
font-size:0.8em;
font-family:Geneva, Tahoma, Arial, Helvetica, Verdana, sans-serif;
border: 1px solid gray;
text-decoration:none;
color:#33ffff;
background:#000;
}
.sidebar ul a:hover
{
background:#fff;
color:#000;
border:1px solid gray;
}
Quelle gentille et géniale personne veut bien m'éclairer SVP ?
Configuration: Mac OS X Firefox 2.0.0.12
3 réponses
-
Merci beaucoup Dreamfeeder,
J'ai résolu le problème en fesant cela :
.sidebar { text-align:center; margin: auto; width:770px; } ul.sidebar { list-style-type:none; /* Suppression des puces du <ul> */ margin: auto; } .sidebar li { display:inline; line-height:34px; } ul.sidebar a { margin: auto; padding: 3px 11px; font-size:0.9em; font-family:Geneva, Tahoma, Arial, Helvetica, Verdana, sans-serif; border: 1px solid gray; text-decoration:none; color:#33ffff; background:#000; } ul.sidebar a:hover { background:#fff; color:#000; border:1px solid gray; }
Comme tu peux le voir, j'ai pas enlevé les " ul " mais les ai mis avant .sidebar.
Amicalement
= Problème Résolu -
jprefere remplacer:
.sidebar
{
text-align:center;
margin: auto;
width:770px;
}
ul.sidebar
{
list-style-type:none; /* Suppression des puces du <ul> */
margin: auto;
}
par
.sidebar ( ou ul.sidebar )
{
text-align:center;
margin: auto;
width:770px;
list-style-type:none; /* Suppression des puces du <ul> */
margin: auto;
}
mais tes ul.sidebar peuvent etre remplacé par .sidebar si tu utilise un class="sidebar" uniquement sur cet balise autant regrouper je trouve ca plus clair ( personnellement ;-) ) -
moi g pas un menu vertical personnelement par contre pour que ca reste coherent fo que tu enleve les ul dans
.sidebar ul ...
puisque ton class=sidebar est appliqué a une balise ul
.sidebar
{
width:770px;
text-align:center;
list-style-type:none; /* Suppression des puces du <ul> */
margin: auto;
}
.sidebar li
{
display:inline;
line-height:34px;
}
.sidebar a
{
margin: auto;
padding: 3px 9px;
font-size:0.8em;
font-family:Geneva, Tahoma, Arial, Helvetica, Verdana, sans-serif;
border: 1px solid gray;
text-decoration:none;
color:#33ffff;
background:#000;
}
.sidebar a:hover
{
background:#fff;
color:#000;
border:1px solid gray;
}
