Bonjour,
J'ai vu que ce sujet a déja été traité dans le forum. Débutante, je n'arrive pas à appliquer les réponses fournies.
le lien donné : http://www.biblographia.net/article/17/css--mettre-envidence-la-page-courante
mon problème : mettre en évidence la page courante dans mon menu.
ma source :
la feuille : style.css
En tout cas, mon menu fonctionne correctement, quand on clique sur un onglet, il devient violet mais le problème c'est qu'il ne le reste pas....
il est écrit de mettre un code dans le fichier CSS mais si je remplace le mien par celui écrit, j'obtiens une liste à puces et le problème reste le même.
J'espère que j'ai été claire et que quelqu'un pourra m'aider à résoudre mon problème.
Merci
j'ai vu que mon message a été édité deux fois..
désolée...mais je ne peux pas suppimer
Modération : Bonjour, yoline, et bienvenue dans le forum
Je restaure ton message original : il semble que tu aies fait une fausse manoeuvre quelque-part ? Il n'y a en tous cas aucune raison de le supprimer
--Laurent Denis
Modifié par Laurent Denis (24 Jul 2005 - 18:24)
J'ai vu que ce sujet a déja été traité dans le forum. Débutante, je n'arrive pas à appliquer les réponses fournies.
le lien donné : http://www.biblographia.net/article/17/css--mettre-envidence-la-page-courante
mon problème : mettre en évidence la page courante dans mon menu.
ma source :
<div id="navcontainer">
<ul id="navlist">
<li><a href="http://yolineg.free.fr/blog/index.php?General" id="Generalnav">Divers</a></li>
<li><a href="http://yolineg.free.fr/blog/index.php?Perso" id="Personav">Perso</a></li>
<li><a href="http://yolineg.free.fr/blog/index.php?Amis-du-web" id="Amis-du-webnav">Amis du web</a></li>
<li><a href="http://yolineg.free.fr/blog/index.php?Mes-passions" id="Mes-passionsnav">Mes passions</a></li>
<li><a href="http://yolineg.free.fr/blog/index.php?gallery" id="gallerynav">Photos</a></li>
<li><a href="http://yolineg.free.fr/blog/index.php?Paroles" id="Parolesnav">Paroles</a></li>
</ul>
[#blue][i]
<!-- c'est écrit mettre un id unique aux pages de chaque rubrique
dans le tutoriel , est-ce ainsi qu'il faut faire et à cet endroit du fichier ???-->[/i]
[#black]
<body id="General"> <body id="Perso">
<body id="Amis du web">
<body id="Mes passions">
<body id ="Photos">
<body id ="Paroles">
</div>
la feuille : style.css
/* La barre horizontale
-------------------------------------------------------- */
#navcontainer
{
background: #EED6FF;
margin: 0 auto;
padding: 1em 0 0 0;
font-family: georgia, serif;
text-align : center;
}
/* to stretch the container div to contain floated list */
#navcontainer:after
{
content: ".";
display: block;
line-height: 1px;
font-size: 1px;
clear: both;
}
ul#navlist
{
list-style: none;
padding: 0;
margin: 0 auto;
width: 80%;
font-size: 0.9em;
font-weight: bold;
}
/* pourcentage à diminuer si on ajoute des onglets*/
ul#navlist li
{
display: block;
float: left;
width: 14%;
margin: 0;
padding: 0;
}
ul#navlist li a
{
display: block;
width: 100%;
padding: 0.5em;
border-width: 1px;
border-color: #ffe #aaab9c #ccc #fff;
border-style: solid;
color: #7A7A7A;
text-decoration: none;
background: #f7f2ea;
}
#navcontainer>ul#navlist li a { width: auto; }
ul#navlist li.active a
{
background: #f0e7d7;
color: #7700FF;
}
ul#navlist li a:hover, ul#navlist li#active a:hover
{
color: #7700FF;
background: transparent;
border-color: #aaab9c #fff #fff #ccc;
}
§§
En tout cas, mon menu fonctionne correctement, quand on clique sur un onglet, il devient violet mais le problème c'est qu'il ne le reste pas....
il est écrit de mettre un code dans le fichier CSS mais si je remplace le mien par celui écrit, j'obtiens une liste à puces et le problème reste le même.
J'espère que j'ai été claire et que quelqu'un pourra m'aider à résoudre mon problème.
Merci
j'ai vu que mon message a été édité deux fois..
désolée...mais je ne peux pas suppimer
Modération : Bonjour, yoline, et bienvenue dans le forum
Je restaure ton message original : il semble que tu aies fait une fausse manoeuvre quelque-part ? Il n'y a en tous cas aucune raison de le supprimer
--Laurent Denis
Modifié par Laurent Denis (24 Jul 2005 - 18:24)
). Donc pour chaque lien, une page différente avec une balise <body> spécifique.
