28172 sujets

CSS et mise en forme, CSS3

Bonjour,

(je fais un second sujet, celui-ci ne traitant pas du même problème).

J'ai dans un menu horizontal, une sous-liste pour chaque onglet, je souhaites positionner en background de cette sous-liste une image en position bottom, mais quoique je fasse celle-ci reste toujours en haut.

Le code en question.

ul#gestionMenu{
   height: 40px;
   font-family: impact;
   position: absolute;
   top: -1px;
   padding: 0 15px 0 0;
   background: url(ongletDroit.png) top right no-repeat;
   font-size: 12px;
}

ul#gestionMenu li{
   position: relative;
   float: left;
   width: 90px;
   height: 30px;
   line-height: 30px;
   text-align: center;
   background: url(onglet.png);
   padding: 0 0 10px 0;
   z-index: 1;
}

ul#gestionMenu li a{
   color: #fff;
}

ul#gestionMenu li.actif{
   color: #ffa500;
}

ul#gestionMenu li.actif a{
   color: #ffa500;
}

ul#gestionMenu li:hover ul.sousMenuGestion{
   display: list-item;
}

ul.sousMenuGestion{
   display: none;
   float: none !important;
   height: auto !important;
   padding: 0 0 8px 0 !important;
   background: url(ongletSousMenuBas.png) bottom left no-repeat !important;
}

ul.sousMenuGestion li{
   height: 20px !important;
   line-height: 20px !important;
   background: url(ongletSousMenu.png) top left !important;
}

ul.sousMenuGestion a{
   color: #ffffff !important;
}

li#arrondiGaucheOnglet{
   width: 15px !important;
   background: url(ongletGauche.png) !important;
}


Je pense que ça vient du float, car en mettant un border sur ma sous-liste ul, il n'encadre que le background, et non tous les éléments li.

Je ne sais pas comment faire pour annuler la propriété float, et pouvoir définir une hauteur auto à ul (suivant les éléments qu'il contient) Smiley confus

Je suis preneur si vous avez une solution.

Merci.
Oui, j'ai compris quand j'ai vu vos réponse, j'essaie aussi sur celle-là en espérant avoir plus de chance.