Bonjour,
j'ai un problème depuis pas mal de temps que je n'arrive pas à résoudre, alors je me tourne vers vous...
Voilà le problème:
lorsque je survol le 3è sous menu d'un de mes menus déroulant, celui-ci saute sur IE 6-7 seulement. En fait c'est lorsqu'il rencontre la div en dessous que cela se produit.Comment résoudre cela, car c'est vraiment contraignant lorsque l'on navigue.
voici le site en question: http://www.a-doc.com/
et voici le css des menus :
ul {list-style-type: none;
margin: 0;
padding: 0;}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#menu {
width: 794px;
margin: 0px;
position: absolute;
z-index: 105;
visibility: visible;
}
#menu dl {
float: left;
width: 131px;
border-left-width: 1px;
border-left-style: solid;
border-left-color: #FFFFFF;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background-image: url(img/bouton-menu-deroulant2.gif);
background-repeat: repeat;
color: #FFFFFF;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 28px;
letter-spacing: 2px;
width: auto;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #FFFFFF;
}
#menu dt a{
color:#FFFFFF;
text-decoration: none;
}
#menu dd {
visibility: visible;
display: none;
}
#menu li {
text-align: center;
background-color: #000066;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #FFFFFF;
height: 28px;
line-height: 30px;
}
#menu li a {
color: #FFFFFF;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.7em;
font-weight: bold;
}
#menu a:hover {
background-color: #5BB4EE;
display:block;
width:131px;
height: 28px;
}
a {
color: #000066;
text-decoration: underline;
}
a:hover {
color: #0099FF;
}
ul#ssmenu
{
margin: 0;
padding: 0;
list-style-type: none;
/* Suppression du margin, du padding et des puces du <ul> */
}
ul#ssmenu li
{
margin: 0 0 10px 0;
padding: 0 ;
/* Suppression du padding du <li> et on définit une marge basse de 10px pour aérer le tout */
}
ul#ssmenu li a
{
display: block; /* On passe les liens en éléments de type block pour leur donner des propriétés de taille */
width: 132px;
line-height: 29px;
color: #000;
text-indent: 7px; /* On décale le texte de 40px du bord gauche */
text-decoration: none;
height: 29px;
background-image: url(img/menu-logiciel.gif);
background-repeat: no-repeat;
background-position: 0 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 0.7em;
}
ul#ssmenu li a:hover
{
background-image: url(img/menu-logiciel.gif);
background-repeat: no-repeat;
background-position: 0 -28px;
color: #FF0000;
}
ul#ssmenu li span a:hover
{
color: #000099;
}
ul#ssmenu li a:active
{
background-image: url(img/menu-logiciel.gif);
background-repeat: no-repeat;
background-position: 0 -28px;
color: #FF0000;
}
Modifié par eman (10 Mar 2009 - 13:16)
j'ai un problème depuis pas mal de temps que je n'arrive pas à résoudre, alors je me tourne vers vous...
Voilà le problème:
lorsque je survol le 3è sous menu d'un de mes menus déroulant, celui-ci saute sur IE 6-7 seulement. En fait c'est lorsqu'il rencontre la div en dessous que cela se produit.Comment résoudre cela, car c'est vraiment contraignant lorsque l'on navigue.
voici le site en question: http://www.a-doc.com/
et voici le css des menus :
ul {list-style-type: none;
margin: 0;
padding: 0;}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
font-family: Verdana, Arial, Helvetica, sans-serif;
}
#menu {
width: 794px;
margin: 0px;
position: absolute;
z-index: 105;
visibility: visible;
}
#menu dl {
float: left;
width: 131px;
border-left-width: 1px;
border-left-style: solid;
border-left-color: #FFFFFF;
}
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background-image: url(img/bouton-menu-deroulant2.gif);
background-repeat: repeat;
color: #FFFFFF;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 28px;
letter-spacing: 2px;
width: auto;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #FFFFFF;
}
#menu dt a{
color:#FFFFFF;
text-decoration: none;
}
#menu dd {
visibility: visible;
display: none;
}
#menu li {
text-align: center;
background-color: #000066;
border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #FFFFFF;
height: 28px;
line-height: 30px;
}
#menu li a {
color: #FFFFFF;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.7em;
font-weight: bold;
}
#menu a:hover {
background-color: #5BB4EE;
display:block;
width:131px;
height: 28px;
}
a {
color: #000066;
text-decoration: underline;
}
a:hover {
color: #0099FF;
}
ul#ssmenu
{
margin: 0;
padding: 0;
list-style-type: none;
/* Suppression du margin, du padding et des puces du <ul> */
}
ul#ssmenu li
{
margin: 0 0 10px 0;
padding: 0 ;
/* Suppression du padding du <li> et on définit une marge basse de 10px pour aérer le tout */
}
ul#ssmenu li a
{
display: block; /* On passe les liens en éléments de type block pour leur donner des propriétés de taille */
width: 132px;
line-height: 29px;
color: #000;
text-indent: 7px; /* On décale le texte de 40px du bord gauche */
text-decoration: none;
height: 29px;
background-image: url(img/menu-logiciel.gif);
background-repeat: no-repeat;
background-position: 0 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 0.7em;
}
ul#ssmenu li a:hover
{
background-image: url(img/menu-logiciel.gif);
background-repeat: no-repeat;
background-position: 0 -28px;
color: #FF0000;
}
ul#ssmenu li span a:hover
{
color: #000099;
}
ul#ssmenu li a:active
{
background-image: url(img/menu-logiciel.gif);
background-repeat: no-repeat;
background-position: 0 -28px;
color: #FF0000;
}
Modifié par eman (10 Mar 2009 - 13:16)