18073 sujets

Questions générales et questions de débutants

[ résolu ]Sous menu id current ou active ?

Bonjour,

Voilà, j'ai un soucis avec un menu...
Smiley confus

Je ne sais pas comment indiquer un active ou current pour mon menu afin de spécifier sur quelle je me trouve...
Voici un morceau de code.
<div id="navcontainer">
            <ul id="smenu">
              <li id="active"> <a href="#" id="sousmenu_active">B&eacute;b&eacute;</a></li>
              <li> <a href="#">Papa</a></li>
              <li> <a href="#">Maman</a></li>
            </ul>
          </div>


et la css
#smenu {
	font: 15px/14px Tahoma, Lucida Grande, Arial, sans-serif;
	padding-left: 0;
	margin-left: 0;
	width: 240px;
	float: left;
	padding-left: 0;
	border-bottom: 1px solid #CCCCCC;
	border-top: 1px solid #CCCCCC;
}
#smenu li {
	list-style: none;
	margin: 0;
	float: left;
	padding: 0.40em;
}
#smenu li a {
	text-decoration: none;
	color: #87E3FE;
	background: none;
}
#smenu a:hover {
	text-decoration: none;
	background: none;
	color: #F86332;
}

#sousmenu_active
{
	text-decoration: none;
	background: none;
	color: #F86332;
}
Smiley cligne

Quelqu'un peut-il me donner un coup de main?

Merci

protéine Smiley biggrin
Modifié par proteine (03 Jul 2006 - 07:23)
Bonjour proteine,

Il me semble que tu as déjà fait l'essentiel du travail. Tu as attribué un identifiant au lien correspondant à la page en cours, ce qui te permet de lui donner le style que tu désires via ta feuille de style CSS.

Pour l'instant, tu lui as donné le même style que pour le survol des liens du menu. Si tu veux un style différent, il suffit de le changer.
Salut mpop,

Au fait j'aimerai les même paramètres que hover, mais ça ne fonctionne pas Smiley decu ... mon élément en active ne prend pas.

help me please.
Bye et bonne journée
Protéine
proteine a écrit :
Au fait j'aimerai les même paramètres que hover, mais ça ne fonctionne pas Smiley decu ... mon élément en active ne prend pas.

Essaie avec le sélecteur suivant :
#smenu a#sousmenu_active


Il se pourrait que les règles appliquées via le sélecteur #smenu li a soient prioritaires.

Au passage, tu peux considérablement épurer ton code, en évitant de répéter les propriétés qui seront héritées. Exemple :
#smenu li a {
	text-decoration: none;
	color: #87E3FE;
	background: none;
}
#smenu a:hover, #smenu a#sousmenu_active {
	color: #F86332;
}
Sujet clos
Aller à