Salut à tous,
Sur le site que je suis en train de réaliser, j'ai positionné à gauche un menu (float:left) contenu deux liste non ordonnées et chaque element des listes etant des liens. Voila à quoi ca ressemble. Il n'y a rien de plus classique
Voila le code css
Mon problème vient du display: block; de mes liens qui ne fonctionne pas sous IE. En effet, si vous passez la souris sur le cellule (hors lien), le background ne change pas. Or ce problème ne se présente pas si mon menu n'est pas positionné en float.
Auriez vous déjà rencontré ce problème, est-ce un bug de IE ou bien une erreur de ma part.
Je vous remercie pour votre aide.
Modifié par ymhotepa (27 Nov 2005 - 19:13)
Sur le site que je suis en train de réaliser, j'ai positionné à gauche un menu (float:left) contenu deux liste non ordonnées et chaque element des listes etant des liens. Voila à quoi ca ressemble. Il n'y a rien de plus classique
<div id="menu">
<div id="menu_general">
<h4>Menu général</h4>
<ul>
<li><a href="./index.php">Accueil</a></li>
<li><a href="./liste_galerie.php">Galeries</a></li>
<li><a href="./contact.php">Contact</a></li>
<li><a href="./plan.php">Plan du site</a></li>
<li><a href="./liens.php">Liens</a></li>
</ul>
</div>
<div id="information">
<h4>Informations</h4>
<ul>
<li><a href="./mentions_legales.php">Mentions légales</a></li>
<li><a href="./infos_site.php">Le site</a></li>
</ul>
</div>
</div>
<!-- Fin du div menu -->
Voila le code css
#menu {
float: left;
width: 160px;
margin-left: 8px;
display: inline; /** Permet de corriger le bug de doublement de marge de IE */
}
#menu_general, #information {
background-color: white;
border: 1px #f47a00 solid;
margin-bottom: 24px;
}
#menu h4 {
font-variant: small-caps;
font-size: 1.3em;
font-weight: bold;
text-align: center;
background-color: #fcc462;
color: #000000;
font-family: Book Antiqua, time, Helvetica, Sans-Serif;
background-image: url(../images/barreTitre.png);
margin-bottom: 0;
}
#menu ul {
margin-bottom: 8px;
margin-top: 4px;
}
#menu li {
display:inline;
}
#menu a {
color: #707070;
display: block;
font-weight: bold;
padding-left: 12px;
border-bottom: 1px silver dotted;
padding-top: 6px;
font-size: 1.1em;
}
#menu_general li.sous_menu a {
padding-left: 26px;
font-style: italic;
}
#menu a:first-letter {
color: #ff9900;
}
#menu a:hover {
background-color: #fedf81;
color: black;
}
Mon problème vient du display: block; de mes liens qui ne fonctionne pas sous IE. En effet, si vous passez la souris sur le cellule (hors lien), le background ne change pas. Or ce problème ne se présente pas si mon menu n'est pas positionné en float.
Auriez vous déjà rencontré ce problème, est-ce un bug de IE ou bien une erreur de ma part.
Je vous remercie pour votre aide.
Modifié par ymhotepa (27 Nov 2005 - 19:13)