menu deroulant css...

  • Auteur de la discussion Auteur de la discussion spalie
  • Date de début Date de début
Nouveau WRInaute
salut,
je suis en train de monter un site qui comporte une galerie d'images qui sont chacunes placées dans certaines categories (voitures,nature,etc...).

Pour afficher ces categories j'utilise des menus et sous-menus comme ceci :


Code:
<div id="cat">
  
	<div id="titre_cat" onclick="javascript:montre('smenu4');">
	Nature
	</div>
	
	<div id="smenu4" class="smenu">
	 	<ul>
	 		<li>Arbre</li>
			<li>Foret</li>
			<li>Feuille</li>
			<li>Montagne</li>
	 	</ul>
	</div>
	
</div>


Exemple:
http://cyril.nadal.free.fr/menu_cat/index.html

si on ne reduit pas la taille du navigateur c'est bon c'est joli.
mais si on le redimenssionne, par exemple au point d'avoir 2 lignes de 2 cases et si l'on ouvre l'une des categorie alors la ligne du dessous se décale n'importe comment.
mais moi justement je ne veux pas et j'aimerais que cette ligne se décale vers le bas en suivant la meme colonne.

si vous ne voyez pas trop ce que je veux dire, demandez moi, je suis la !!!

si vous pouvez m'aider parce que là je galere depuis un petit moment!!

merci.
 
Nouveau WRInaute
ok.

si tu va voir le lien que j'ai mis, tu vois 4 bloc qui sont des menus. lorsqu'on clique les sous menu apparaissent.

mais quand je reduis ma fenetre et que par exemple j'affiche le sous menu de la premiere case (h-menu
 
Nouveau WRInaute
désolé ca a validé le post !!!

je reprend.

j'affiche le sous menu de la premiere case (haut-gauche).
la case qui est dessous va se ranger sur la deuxieme colonne. mais moi je veux que ca décale juste cette deuxiemme ligne
 
WRInaute accro
ok j'ai compris. tu m'etonnes que je ne comprenait pas, j'etais sous firefox :)

essaye ton exemple sous firefox, tu comprendra qu'il faut revoir ton code :) tu as la css du menu ?
 
Nouveau WRInaute
et voila le code du css :

Code:
#cat{
width:140px;
text-align:center;
float:left;
position:fixed;
margin-right:20;
}


#titre_cat{
height: 17px;
font-size:18px;
color:black;
background-color:#CCCCCC;
cursor: pointer;
}


.smenu{
color:#0000FF;
width:140px;
font-size:14px;
}

#menu_cat li {
background-color: #FFFFFF;
}

ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
 
Discussions similaires
Haut