28220 sujets

CSS et mise en forme, CSS3

Sous-menu bordure Bottom

Bonjour,

En terminant mon sous-menu, je m'aperçois que ma bordure du bas est différente sous FF et IE

Je dois certainement faire une erreur dans la css, mais je ne vois pas. Smiley confus
En effet, j'aimerai que mon sous-menu soit en normale souligné en gris et non en violet ( violet = soulignement des liens normaux) et que lorsque que l'on passe dessus, la bordure disparaisse et que mon texte s'agrandissent.

Quelqu'un peut me venir en aide?

html:

<div class="element_menu">
          <ul>
            <li>
            <a href="#ecouter" title="Accesskey: 1" accesskey="1" > Ecouter  </a></li>
            <li>
            <a href="#voir" title="Accesskey: 2" accesskey="2">  Voir </a></li>
            <li>
            <a href="#sentir" title="Accesskey: 3" accesskey="3">  Sentir </a></li>
          </ul>
        </div>

et

.element_menu {
	
	color: #ffffff;
	letter-spacing: 0.2em;
	position:relative;
	float: left;
	list-style: none;
	padding: 0 0 0 2px;
	margin: 0 0 5px 2px;
	text-decoration: none;
	letter-spacing: 0.6pt;
}


.element_menu ul {
/* Toutes les listes  Ô¡ puces se trouvant dans un menu */
	list-style: none;
	padding: 0 0 0 2px;
	margin: 0 0 5px 2px;
	text-decoration: none;
	letter-spacing: 0.6pt;
	
}

.element_menu li{
border-bottom: 1px solid #ddd;

}


.element_menu li a {
/* Tous les liens se trouvant dans un menu */
	display: block;
	padding: 3px 0px 3px 0px;
	width: 192px;
	border-bottom: 1px solid #ddd;
	color: #cccccc;
	font-weight: bold;
	text-align: left;
	text-decoration: none;
	letter-spacing: -1px;
}

.element_menu li a:hover, .element_menu 
/* Quand on pointe sur un lien du menu */
 {
	font-size: 1.2em;
	color: #9523E7;
	
	text-decoration: none;
}

Smiley biggrin
Merci d'avance de ton aide

Garden
essaye plutot ceci :
(j'ai mis en commentaires tes anciennes lignes fausses pour moi)
.element_menu {
	color: #ffffff;
	letter-spacing: 0.2em;
	position:relative;
	float: left;
	list-style: none;
	padding: 0 0 0 2px;
	margin: 0 0 5px 2px;
	text-decoration: none;
	letter-spacing: 0.6pt;
}

.element_menu ul {
/* Toutes les listes  Ô¡ puces se trouvant dans un menu */
	list-style: none;
	padding: 0 0 0 2px;
	margin: 0 0 5px 2px;
	text-decoration: none;
	letter-spacing: 0.6pt;
}

.element_menu li{
/*border-bottom: 1px solid #ddd;*/
}

.element_menu li a {
/* Tous les liens se trouvant dans un menu */
	display: block;
	padding: 3px 0px 3px 0px;
	width: 192px;
	border-bottom: 1px solid #ddd;
	color: #cccccc;
	font-weight: bold;
	text-align: left;
	text-decoration: none;
	letter-spacing: -1px;
}

.element_menu li a:hover, .element_menu 
/* Quand on pointe sur un lien du menu */
 {
	font-size: 1.2em;
	/*color: #9523E7;*/
	text-decoration: none;
	border-bottom-width: 0px;

}


par contre n'oublie pas de spécifié une police par défaut car IE et Fx n'ont pas forcément la même police par défaut donc l'affichage diffère.
font-family : ...
Bonjour,
A vrai dire il a peu de changement Smiley bawling
En réalité, les liens normaux 
a:link, a:visited {
	color: #9523E7;
	border-bottom: 1px dotted #9523E7;
	text-decoration: none;

	
	
	}
a:hover, a:active {
	color: #9523E7;
	border: none;
	}


influencent constament la bordure sousI E ( soulinement en trait-tillé)

Je ne saisi pas, ma bordure dans LI A est pourtant spécifiée.
Merci de votre aide

Garden Smiley cligne
Sujet clos
Aller à