28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous !
J'ai un problème sur mon menu.
Quand on clique sur une catégorie,le menu se déroule.
Sauf que ce qui doit se dérouler se déroule a coté de la catégorie et pas en dessous.

Regarder : http://www.wolfsite.fr/Huissier

J'ai essayer de mettre des DIV STYLE HEIGHT entre la div de la catégorie, et la div qui se déplie, sa marche mais ce n'est pas compatible entre firefox et ie.

Puis c'est pas très propre Voici les code source :

HTML MENU
<div class="menu">


<div onclick="Ajax('','contenu/index.html','texte')" class="itemMenu">
<div class="ecrituremenu">Accueil</div>
</div>


<div onclick="new Effect.toggle('sousmenu2','blind'); Ajax('','contenu/rolehuissier.html','texte')" class="itemMenu">
<div class="ecrituremenu">Le rôle de l'huissier</div>
</div>
<div id="sousmenu2" style="display:none">
<div class="itemSousmenu">Le statut de l'huissier de justice<br /></div>
<div class="itemSousmenu">L'huissier de justice et les particuliers<br /></div>
<div class="itemSousmenu">L'huissier de justice et les entreprises<br /></div>
</div>


<div onclick="new Effect.toggle('sousmenu3','blind'); Ajax('','contenu/rolehuissier.html','texte')" class="itemMenu">
<div class="ecrituremenu">Recouvrement</div>
</div>
<div id="sousmenu3" style="display:none">
<div class="itemSousmenu">Le recouvrement amiable<br /></div>
<div class="itemSousmenu">Le recouvrement judiciaire<br /></div>
</div>


<div onclick="new Effect.toggle('sousmenu4','blind'); Ajax('','contenu/rolehuissier.html','texte')" class="itemMenu">
<div class="ecrituremenu">Jeux / Concours</div>
</div>
<div id="sousmenu4" style="display:none">
<div class="itemSousmenu">Comment faire ?<br /></div>
<div class="itemSousmenu">Règlements de Jeux coucours<br /></div>
</div>


<div onclick="Ajax('','contenu/rolehuissier.html','texte')" class="itemMenu">
<div class="ecrituremenu">Liens utiles</div>
</div>


<div onclick="Ajax('','contenu/rolehuissier.html','texte')" class="itemMenu">
<div class="ecrituremenu">Tarif de l'huissier</div>
</div>


<div onclick="new Effect.toggle('sousmenu5','blind'); Ajax('','contenu/rolehuissier.html','texte')" class="itemMenu">
<div class="ecrituremenu">Immobilier / Locations</div>
</div>
<div id="sousmenu5" style="display:none">
<div class="itemSousmenu">L'huissier administrateur d'immeubles<br /></div>
<div class="itemSousmenu">Nos locations<br /></div>
</div>


<div onclick="new Effect.toggle('sousmenu6','blind'); Ajax('','contenu/rolehuissier.html','texte')" class="itemMenu">
<div class="ecrituremenu">Paiement en ligne</div>
</div>
<div id="sousmenu6" style="display:none">
<div class="itemSousmenu">Module de paiement en ligne<br /></div>
</div>


<div onclick="Ajax('','contenu/rolehuissier.html','texte')" class="itemMenu"><div class="ecrituremenu">Contact</div></div>


</div>


CSS MENU

.menu {
width:200px;
height:400px;
float:left;
margin-top:15px;
}
.itemMenu       {
                       color: red;
                       font-weight: bold;
                       font-family:Arial, Helvetica, sans-serif;
                       font-size: 14px;
                       background-image:url(images/bouton/fondcat.png);
                       background-repeat:no-repeat;
                       width:160px;
                       height:45px;
                       float:left;

}

.itemSousmenu {
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
padding-left:12px;

}

.itemMenu #hover, .itemSousmenu #hover{
                               text-decoration: underline;
}

.ecrituremenu {
       font-family:Arial, Helvetica, sans-serif;
       font-size:12px;
       color:#FFFFFF;
       font-weight:bold;
       padding-top:12px;
       padding-left:15px;
       width:150px;
       height:30px;
}


Voilà merci de m'aider =)
Je me permet de faire un petit UP c'est assez urgent et je ne trouve aucune solution Smiley bawling

Merci ! Si vous avez besoin de plus d'infos n'hésitez pas !
salut,
je sais pas trop vu comme ça, mais si dans ton css la class
(itemsousmenu)tu lui donnais une largeur

genre:

.itemSousmenu {
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
padding-left:12px;
[#red]width:200px;
}