[Résolu]Menu onglets avec sous menus

bonsoir !

J'essaie de faire un menu en onglets avec des sous-menus qui s'afficheraient sous les onglets. Mon menu en onglets marchent tant que je n'essaie pas de mettre les sous-menus...
ma page
Pour tester, j'ai mis les sous-menus seulement à l'onglet 2.
Comme vous pouvez le voir, le menu change de place quand il a le sous-menus. En plus, le trait noir disparait. Quelqu'un a une idée d'où vient le problème ?
Modifié par p_tite_jo (18 Jan 2006 - 13:57)

p_tite_jo a écrit :
bonsoir !

J'essaie de faire un menu en onglets avec des sous-menus qui s'afficheraient sous les onglets. Mon menu en onglets marchent tant que je n'essaie pas de mettre les sous-menus...

...

Quelqu'un a une idée d'où vient le problème ?

A priori, je dirais qu'il réside logiquement dans le fait de mettre les sous-menus et que la solution est donc de ne pas mettre de sous-menus.

Derrière cette boutade, une question: tes visiteurs auront-ils besoin de ces liens en sous-menus au prix d'une des formes de menus à coulisse les plus déroutantes et les plus mal utilisables qui soit ?
Modifié par Laurent Denis (15 Jan 2006 - 20:24)

euh ...
j'ai pensé au système des onglets car je trouve que c'est celui qui s'intègre le mieux dans mon design.... et j'ai besoin de sous-menus faute de place. pour être sûrs que l'on se comprenne, mon idée rejoint http://www.bilboquet.com/

pff.. j suis en train de péter un plomb avec ce menu...
J'ai enfin réussi à avoir un début de résultat acceptable sur IE, mais sur Firefox c'est l'anarchie ! ma page en ligne.
Malgré ce que m'a dit Laurent Denis, je persiste encore un moment à faire des onglets.

voilà j'ai avancé un peu... mais la j'ai un soucis avec mon onglet "actif". j'ai deux images, une pour l'onglet "inactif" et une deuxième pr l'onglet "actif". j'arrive à positionner mes images quand les onglets sont actifs mais dès que je tente de mettre les onglets actifs, l'image n'apparaît pas en entier. ma page. en cliquant sur l'onglet 2, vous pouvez voir le résultat avec les onglets inactifs.

.menu { /* boite qui contient le menu (les onglets) */
padding-bottom: 5px ;
margin-top: 25px;
background : url(onglets/trait_menu.gif) bottom no-repeat ;
width: 552px;


}

.onglet_1 { /* style des onglets inactifs */
  text-decoration:none ;
  text-align:center;
  color: #EAB788;
  font-size : 15px ;
  float:left ;
  width:95px ;
	padding-left: 0px;
	background : url(onglets/onglet_1_inactif.gif) bottom no-repeat ;
  }
.onglet-actif {
  position:relative ; /* l'onglet inactif est mis en position relative */
  width: 95px;
/* pour pouvoir baisser l'onglet de 2 pixels */
	background : url(onglets/onglet_1.gif) bottom no-repeat ;
	
	}

.spacer {clear:both}

<div class="menu"> <!-- début de la boite contenant les onglets -->
  <span class="onglet_1 onglet-actif">Onglet 1</span> <!-- onglet ACTIF -->  
  <a class="onglet_2" href="menu_test.php">Onglet 2</a> <!-- onglet inactif -->  
	<a class="onglet_3" href="#">Onglet 3</a> <!-- onglet inactif -->
  <a class="onglet_4" href="#">Onglet 4</a> <!-- onglet inactif -->
	<a class="onglet_5" href="#">Onglet 5</a> <!-- onglet inactif -->
	
  <div class="spacer"></div>
</div>