Contraire d'inline-block en display

[TiDi] Messages postés 126 Date d'inscription Statut Membre Dernière intervention -
animostab Messages postés 2829 Date d'inscription Statut Membre Dernière intervention - 27 mars 2014 à 23:49

Bonjour,

Je cherche à faire un menu déroulant. Le premier groupe (le menu visible) doit être en inline-block mais je voudrais que les sous-menus soient normal, que chaque liste soit à la ligne.

    <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 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;
}
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 li
{
 display: inline-block;
}
nav ul ul
{
 display: none;
 position: absolute;
 
}
nav li:hover ul.level2
{
 display: block;
}

Donc comment faire pour que ce level 2 soit normal et non inline-block comme définit dans nav ul et nav li ?

Merci de votre aide.

TiDi

Afficher la suite

A voir également:

Display:block
Block breaker - Accueil - Services en ligne
Code block - Télécharger - Langages
Display fusion - Télécharger - Divers Utilitaires
Peer block - Télécharger - Pare-feu
Wireless display edenwood ✓ - Forum TV & Vidéo

1 réponse

Réponse 1 / 1

3IR3 Messages postés 901 Date d'inscription Statut Membre Dernière intervention 228

Bonjour,

Est ce que le code ci-dessous marche pour ce que tu veux faire?

nav li 
{ 
display:inline-block;
position:relative 
}

nav li li 
{ 
display:block
 }
			
nav a 
{ 
display:block;
... 
}

[TiDi] Messages postés 126 Date d'inscription Statut Membre Dernière intervention 262

Non ça ne marche car tout les menus sont visibles, hover ne marche plus.

animostab Messages postés 2829 Date d'inscription Statut Membre Dernière intervention 738

salut

comme dans ton code

nav ul ul {display:none;}

et

nav ul li a:hover ul {display:block;}

nav ul li ul li {display block;}

le style de .level12 {....} ne pourras te servir qu'a definir autre chose que display (par exemple color etc...)

Discussions similaires

Caster tv edenwood

Renseignement 1fichier

Wireless display

display name ?

Qu'est ce que Nvidia Display Container LS ?

Votre réponse

Discussions similaires