Menu CSS incompatible Safari

Bonjour,

je suis en train de me casser la tête sur un menu déroulant qui doit fonctionner impérativement sur FF, IE6 et 7 et Safari. Le menu "fonctionne" mais la mise en forme pêche un peu. Sous Safari le surlignement des intitulés des sous-menus ne fonctionne pas, en fait il faut arriver à choper la bordure du sous-menu pour qu'il se surligne. Je ne vois vraiment pas d'où vient le problème.
Si quelqu'un peut m'aider avec Safari je lui sera reconnaissant.

Merci d'avance.
Modifié par TechnoGreg (09 May 2007 - 15:11)

Un lien? Du code? Un screenshot?
Modifié par Benjamin D.C. (09 May 2007 - 14:45)

Wow oui en effet j'ai zappé le plus important -_-"


Gomen

Le code XHTML :

<dl id="menu">
        <dt onmouseover="javascript:montre('smenu1');">
          l'agence
        </dt>
        <dd id="smenu1" onmouseover="javascript:montre('smenu1');" onmouseout="javascript:montre();">
					<ul>
            <li>
              <a id="metier" href="metier.php">&nbsp;notre métier</a>
            </li>
            <li>
              <a id="studio" href="studio.php">&nbsp;studio graphique</a>
            </li>
            <li>
              <a id="redaction" href="redaction.php">&nbsp;côté rédaction</a>
            </li>
            <li>
              <a id="offres" href="offres.php">&nbsp;offres spécifiques</a>
            </li>
            <li>
              <a id="duo" href="duo.php">&nbsp;le duo</a>
            </li>
            <li>
              <a id="convictions" href="convictions.php">&nbsp;nos convictions</a>
            </li>
            <li>
              <a id="tarifs" href="tarifs.php">&nbsp;question tarifs</a>
            </li>
            <li>
              <a id="rugby" href="rugby.php">&nbsp;...et le rugby</a>
            </li>
          </ul>
				</dd>
        <dt onmouseover="javascript:montre('smenu2');">
          le book
        </dt>
        <dd id="smenu2" onmouseover="javascript:montre('smenu2');" onmouseout="javascript:montre();">
          <ul>
            <li>
              <a id="preuve" href="book2.php">&nbsp;la preuve par l'image</a>
            </li>
          </ul>
        </dd>
        <dt onmouseover="javascript:montre('smenu3');">
          contact
        </dt>
        <dd id="smenu3" onmouseover="javascript:montre('smenu3');" onmouseout="javascript:montre();">
          <ul>
            <li>
              <a id="photomaton" href="galerie.php">&nbsp;galerie photos</a>
            </li>
            <li>
              <a id="contact" href="contact.php">&nbsp;page contact</a>
            </li>
          </ul>
        </dd>
      </dl>

La CSS :

/* CSS Document */
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute;
top: 40px;
left: 125px;
width: 4em;
}
#menu dt {
height: 20px;
line-height: 18px;
font-weight: bold;
}
#menu dd {
position: absolute;
z-index: 200;
left: 4em;
margin-top: -1.5em;
width: 10em;
border:none;
}
#menu li {
margin:0px;
padding:0px;
font-size: 12px;
height: 18px;
line-height: 1.5em;
border:none;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 18px;
line-height: 1.5em;
border:none;
}
#metier:hover {
background-color:rgb(0,155,184);
color:white;
}
#studio:hover {
background-color:rgb(255,109,0);
color:white;
}
#redaction:hover {
background-color:rgb(255,45,184);
color:white;
}
#offres:hover {
background-color:rgb(223,216,0);
color:white;
}
#duo:hover {
background-color:rgb(140,0,149);
color:white;
}
#convictions:hover {
background-color:rgb(0,232,0);
color:white;
}
#tarifs:hover {
background-color:rgb(172,152,96);
color:white;
}
#rugby:hover {
background-color:rgb(187,237,3);
color:white;
}

Modifié par TechnoGreg (09 May 2007 - 14:55)