Problème d'espacement dans un menu deroulant sur IE

Bonjour,

voila j'ai trouvé un script pour me faire un menu deroulant. Le problème que j'ai est que quand j'ai un sous menu il y a un petit espacement entre les elements du premier niveau uniquement sur IE7...
comme on peut le voir sur cette image :

ou bien sur le site a cette adresse:
http://staging.uniteloverval.be/

la CSS ce trouver ici :http://staging.uniteloverval.be/design/css/screen.css

est ce que quelqu'un a une idée pour corriger cela ?

Merci d'avance ...

Salut!

Tu pourrais nous faire un copier/coller de ton fichier CSS ? Car là c'est incrompréensible ;). Tu mets ton code entre les balise "[code]"
L'erreur est sûrement dans ton script mais son on ne peut pas le lire ( car c'est illisible) on ne risque pas de te repondre ;)

Roswald

Tu n' a pas tore ..

voici le code HTML

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
 
<div class="menu">
      <ul id="menu">
        <li><a href="#">Unité</a>
          <ul>
            <li><a href="#">Fédérations</a>
              <ul>
                <li><a href="content/gcb.php">Les guides</a></li>
                <li><a href="content/fcs.php">Les Scouts</a></li>
              </ul>
            </li>
            <li><a href="#">Uniforme</a>
              <ul>
                <li><a href="#">Guides</a></li>
                <li><a href="#">Scouts</a></li>
              </ul>
            </li>
            <li><a href="agenda-unite-7.html">Agenda</a></li>
            <li><a href="news-unite-7.html">News</a></li>
            <li><a href="galerie-unite-7.html">Photos</a></li>
            <li><a href="staff-unite-7.html">Staff</a></li>
          </ul>
        </li>
      </ul>
      <div class="clr"></div>
    </div>

Et le code CSS :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
 
 
.menu { position:absolute; text-align:left; top:0; width:730px; margin:50px 0 0 3px}
#menu{ margin:0 auto;}
.menu a,
.menu a:link,
.menu a:active,
.menu a:visited{ color:#FFF; text-decoration:none}
.menu a:hover{ color:#FFF; text-decoration:none}
.menu ul{margin:0; padding:0; list-style-type:none; background:none;}
.menu ul li{position:relative; display:inline; font-weight:bold; float:left; height:25px; margin:0 5px 0 0 ; background:url(../images/bgMenu.gif) repeat-x;}
.menu ul li a{ display:block; border:solid #6b8a9c; border-width:0 1px 1px 1px; width:80px; padding:5px 8px; text-decoration:none;}
.menu ul li ul{left:0; position:absolute; top:1em; display:block; visibility:hidden; width:103px;}
.menu ul li ul li{display:list-item; float:none; background:#80abbc;}
.menu ul li ul li ul{left:159px; top:0; border:none; padding:0; margin:0;}
.menu ul li ul li a,
.menu ul li ul li a:link,
.menu ul li ul li a:active
.menu ul li ul li a:visited{display:block; border:none; width:81px; color:#fff; text-decoration:none; }
.menu ul li ul li a:hover{ background:#6b8a9c; text-decoration:none}
.menu ul li a:hover{ color:white; text-decoration:none;}
 
.menu .mainfoldericon{color:#FFF}
 
* html p#iepara{ padding-top:1em; }
* html .menu ul li { float:left; height:1%; }
* html .menu ul li a { height:1%; }

voila en espérent que ça pourra vous aidez un peu plus ...

Gauthier