<nav>
	<ul class="level1" id="nav">
		<li><a href="index.php">Accueil</a></li>
		<li><a href="presentation.php">Présentation officielle</a></li>
		<li><a href="actualite.php">Acutalité</a></li>
		<li><a href="recherche.php">Recherche & Développement</a></li>
		<li><a href="achat_groupe.php">Achat Groupé</a></li>
		<li><a href="finances.php">Finances</a></li>
		<li><a href="compagnie/index.php">Compagnies aériennes membres</a>
			<ul class="level2">
				<li><a href="compagnie/consult_compagnie.php?id=1">Flight</a><li>
				<li><a href="compagnie/consult_compagnie.php?id=1">Flight</a><li>
				<li><a href="compagnie/consult_compagnie.php?id=1">Flight</a><li>
			</ul>
		</li>
	</ul>
</nav>

nav
{
	text-align: center;
	vertical-align: middle;
	background-color: #cdc2b4;
}
nav a
{
	color: white;
	font-family: MS Reference, Arial, Serif;
	font-size: 1em;
	text-decoration: none;
}
nav ul
{
	list-style-type: none;
	display: inline-block;
}
nav .level1 li
{
	display: inline-block;
}
nav ul ul
{
	display: none;
	position: absolute;
	
}
nav li:hover ul.level2
{
	display: block;
}

Bonjour,

Je cherche à faire un menu déroulant sur mon site mais j'ai un problème car je veux que les listes du menu visible (de niveau 1) soient sur la même ligne donc inline-block mais je ne veux pas que les listes des sous-menus (de niveau 2) soient sur la même ligne, je voudrais qu'ils soient normal.

Ca me donne ça :
[img]http://nsm08.casimages.com/img/2014/03/27//14032706463217402312103088.png[/img]
Je voudrai que les Google Flight soient les un sous les autres.

Voici mon menu en HTML :
[html]
<nav>
<ul class="level1" id="nav">
<li><a href="index.php">Accueil</a></li>
<li><a href="presentation.php">Présentation officielle</a></li>
<li><a href="actualite.php">Acutalité</a></li>
<li><a href="recherche.php">Recherche & Développement</a></li>
<li><a href="achat_groupe.php">Achat Groupé</a></li>
<li><a href="finances.php">Finances</a></li>
<li><a href="compagnie/index.php">Compagnies aériennes membres</a>
<ul class="level2">
<li><a href="compagnie/consult_compagnie.php?id=1">Flight</a><li>
<li><a href="compagnie/consult_compagnie.php?id=1">Flight</a><li>
<li><a href="compagnie/consult_compagnie.php?id=1">Flight</a><li>
</ul>
</li>
</ul>
</nav>
[/html]

Voici mon CSS :
[css]
nav
{
text-align: center;
vertical-align: middle;
background-color: #cdc2b4;
}
nav a
{
color: white;
font-family: MS Reference, Arial, Serif;
font-size: 1em;
text-decoration: none;
}
nav ul
{
list-style-type: none;
display: inline-block;
}
nav .level1 li
{
display: inline-block;
}
nav ul ul
{
display: none;
position: absolute;

}
nav li:hover ul.level2
{
display: block;
}
[/css]

Merci de votre aide.