Problème menu css avec IE

Bonjour,

J'ai un petit problème qui commence à sérieusement m'énerver depuis deux jours...

J'ai crée une page xhtml et css, mais, n'étant pas très bon en css les blocs me posent problème...

voyez donc cette page sous firefox:
**SUPPRIME**

et maintenant sous IE...

Le menu est coupé en haut.

Voici mon code xhtml du menu:

<div id="menu"><div class="hautmenu"></div>
                        <div class="elementsmen">
                                <h4>Menu</h4>
                                <ul>
                                        <li><a href="index.php">Accueil</a></li>
                                        <li><a href="surprizradar.php">Surpriz'radar</a></li>
                                        <li><a href="surpriztv.php">Surpriz'tv</a></li>
                                        <li><a href="page6.html">Lien</a></li>
                                </ul>
                        </div>

                        <div class="basmenu">
                        </div>
</div>

et celui du css:

body
{
   width: 760px;
   margin: auto;
   margin-top: 20px;
   margin-bottom: 20px;
   background-image: url("images/background.gif");
}
#header
{
   width: 760px;
   height: 100px;
   background-image: url("images/header1.gif");
   background-repeat: no-repeat;
   margin-bottom: 7px;
}
#hautsecheader
{
        width : 760px;
        height: 20px;
        background-image: url("images/headhaut.gif");
        background-repeat: no-repeat;
}
#bassecheader
{
        width : 760px;
        height: 18px;
        margin-bottom: 9px;
        background-image: url("images/headbas.gif");
        background-repeat: no-repeat;
}
#secheader
{
   width: 760px;
   height: 28px;
   padding-top: 13px;
   font-weight:bold;
   vertical-align: middle;
   text-align: center;
   background-image: url("images/headbords.gif");
}
#menu
{
        float:left;
        width:150px;
}
.hautmenu
{
        background-image: url("images/menhaut.gif");
        width:150px;
        float:left;
        height:7px;
        background-repeat: no-repeat;
}
.elementsmen
{
        background-image: url("images/menbords.gif");
        width:150px;
        float:left;
}
.basmenu
{
        background-image: url("images/menbas.gif");
        width:150px;
        float:left;
        height:7px;
        background-repeat: no-repeat;
}
#mainp
{
        margin-left: 150px;
        height: 20px;
        background-image: url("images/haut.gif");
}
#maind
{
        margin-left: 150px;
        padding-left: 20px;
        padding-right: 20px;
        text-align: center;
        background-image: url("images/bords.gif");
}
#mainb
{
        margin-left: 150px;
        height: 20px;
        background-image: url("images/bas.gif");
}
#hautfooter
{
        height: 20px;
        margin-top: 20px;
        margin-left: 150px;
        width: 610px;
        background-image: url("images/haut.gif");
        background-repeat: repeat-x;
}
#footer
{
        font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
        text-align: center;
        height: 20px;
        margin-left: 150px;
        width : 610px;
        background-image: url("images/bords.gif");
}
#basfooter
{
        height: 21px;
        margin-left: 150px;
        width : 610px;
        background-repeat: repeat-x;
        background-image: url("images/bas.gif");
}
input.connexion
{
        border:1px solid #1277ce;
        background-color:#ffffff;
        width:90px;
}
.imageconn
{
        border: 0px;
        vertical-align: middle;
}
.elementsmen h1,h2,h3,h4,h5,h6
{
   color: #FF3000;
   font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
   text-align: center;
}

merci d'avance pour votre aide
Modifié par jejemas (08 May 2006 - 20:18)

Salut! Essaie de placer ça dans ton div hautmenu.

{line-height:0em;font-size:0em;}

oui ca a résolu mon problème. merci beaucoup.

Peux-tu m'expliquer ce que tu m'as fait changé?

J'ai aussi connu ce probleme.
J'avais défini le line-height et le font-size (stupidement, j'avoue) dans ma balise body, ce qui fait que sur IE ça se répercute sur certains autres style même lorsqu'ils ne contiennent pas de texte, ce qui semble ne pas etre le cas avec firefox.
(PS:essaie ton site avec Opéra, il y a encore plein de décalages...)

voilà. je crois avoir résolu la plupart des bugs de décalage pour la base du design.. j'ai meme du créer une feuille css supplémentaire rien que pour IE car il me posait encore d'autres problèmes... J'ai téléchargé opera et ca semble aussi bon. Y aurait-il encore d'autres navigateurs où il y a des problèmes? Quelques personnes pourraient vérifier que le design est bien collé svp? Merci

au passage vu qu'on parle d'opera ...
le % de gens qui utilse opera est de l'ordre de combien?