Bonjour à tous!

J'ai un petit problème sur un menu déroulant horizontal. Je me demandais si quelqu'un pouvait m'aider?

Lorsque ma souris passe sur un titre, les sous-titres de cette section apparaît sous le titre, en inline. C'est okay pour le premier titre sauf qu'après, les sous-titres étant alignés sous le titre, fait en sorte que mes options ne commence pas complètement à gauche de la division. Si je fais left: 0px, ça m'amène collé au début de la fenêtre du browser, alors que la div est centrée et ne prend pas tout l'espace...



Le HTML va comme suit :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
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>
      <li>menu 1
            <ul>
                  <li>sous-menu 1.1</li>
                  <li>sous-menu 1.2</li>
                  <li>sous-menu 1.3</li>
            </ul>
      </li>
      <li>menu 2
            <ul>
                  <li>sous-menu 2.1</li>
                  <li>sous-menu 2.2</li>
                  <li>sous-menu 2.3</li>     
             </ul>
      </li>
      <li>menu 3
             <ul>
                  <li>sous-menu 3.1</li>
                  <li>sous-menu 3.2</li>
                  <li>sous-menu 3.3</li>   
             </ul>   
      </li>
</ul>
</div>
Et le CSS :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
28
29
 
.menu {
	background: url(images/menubg.gif) repeat-x;
	height: 42px;
}
 
#menu ul{
	margin:0px;
	padding: 0px;
	list-style-type: none;	
}
 
.menu ul li {
	float:left;
}
 
.menu ul li a {
	display: block;
	padding: 4px 10px;	
}
 
.menu ul li:hover ul, .menu ul a:hover ul {
	visibility: visible;
}
 
.menu ul ul {
	position: absolute;
	visibility: hidden;
}

Est-ce que quelqu'un a une idée?

Merci!!
Isabelle