[résolu]Héritage de styles sur un lien

Bonsoir,

J'ai lu l'article expliquant le concept de l'héritage des propriétés mais j'ai dû louper quelque chose.

J'ai un menu sous forme de liste de liens.

<ul class="menu">
	<li><a href="#a" accesskey="1" title="A">A</a></li>
	<li><a href="#b" accesskey="2" title="B">B</a></li>
	<li><a href="#c" accesskey="3" title="C">C</a></li>
	</ul>

Je l'ai mis en forme de cette façon :

.menu{
	margin: 0px;
	line-height: 2em;
	margin-top: 15px;
	}
	
.menu li{
	list-style: none;
	height: 30px;
	padding-bottom: 10px;
	}

.menu a, a:link{
	color: white;
	text-decoration: none;
	font-size: 1.1em;
	padding: 5px;
	background-color: #246C84;
	border-radius: 6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
}

.menu a:hover, a:active, a:focus{
	color: #A63E2B;
	text-decoration: none;
	font-size: 1.1em;
	padding: 5px;
	width: 117px;
	height: 30px;
	background-color: #FFE4A4;
	border-radius: 6px;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
}

Mon problème, c'est que j'ai :
- une autre liste de liens qui hérite des propriétés des liens du menu ce que je ne souhaite pas

<h3>Liens</h3>
<ul>
<li>
<a href="Mon lien" title="Mon lien">Mon lien</a></li>
</ul>

- un autre lien qui prend lui les propriétaires de a:hover

<p class="haut"><a href="#haut">Haut de page</a></p>

Mes styles pour les liens :

a, a:link {
    color: #A63E2B;
    text-decoration: underline;
}

a:hover, a:focus, a:focus {
    color: #404040;
}

Est-ce que vous pouvez m'expliquer pourquoi ça ne marche pas ?

Merci beaucoup

EDIT :
En fait, je m'auto-réponds, c'est la couleur de fond qui s'ajoute, sans doute parce qu'elle n'est pas définie auparavant.
Est-ce qu'on peut mettre un background-color:none; ?
Modifié par thelma (05 Oct 2010 - 12:53)

Bonjour,

Avec :

.menu a:hover, a:active, a:focus{ 

Tu cible les liens survolés contenus dans une class menu et tous les liens actifs plus tous les liens qui ont le focus.

.menu

doit être répété après la virgule.

C'était aussi simple que ça !
Merci Laurie-Anne.