Alignement menu différent sous IE et Mozilla

Bonjour,

J'ai un petit soucis pour placer un menu horizontal sur une page. Comme il doit apparaitre sur une image, sa position verticale doit être assez précise. Or avec exactement le même code j'obtiens une différence non négligeable entre la version d'Internet explorer et celle de Mozilla. Et forcément dans un des cas le menu n'apparait pas au bon endroit vis à vis de l'image du dessous et il devient illisible ....:-S (ce serait tellement moins drôle si tout marchait toujours comme prévu ...)!

Voilà le code html :

<div id="Layer10" style="position:absolute; left:224px; top:100px; width:653px; height:22px; z-index:15">
  <p class="menuhaut"><a href="preface.htm">Pr&eacute;lude</a> 
  | <a href="biographie.htm">Biographie</a> 
  | <a href="lesalbums.htm">Discographie</a> 
  | <a href="spectacles.htm">Spectacles</a> 
  | <a href="photos.htm">Photos</a> 
  | <a href="violacaipira.htm">Instruments</a> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  | <a href="contact.htm">Contact</a></p></div>

et la description css correspondante :

p
{
   font-size: 1em;
   text-indent: 30px; 
   text-align: justify; 
   font-family: Calibri, Geneva, Helvetica, "Arial Narrow", Serif;
   color: #FF9933;
}

.menuhaut
{
   color: #FF9933;
   font-family: Calibri, Geneva, Helvetica, "Arial Narrow", Serif;
   font-size: 1em;
   font-weight: bold;
   text-align: center;
}

#Layer14 a , #Layer10 a
{
   color: #000000;
   text-decoration: none;
}

Si jamais vous avez une idée lumineuse sur le pourquoi du comment de ce bug surtout n'hésitez pas à m'en faire part ! :-P

++
Marinettaroulettes