28172 sujets

CSS et mise en forme, CSS3

Bonjour a tous!

Je viens vers vous aujourd'hui pour vous demander votre aide, suite a un probleme que je ne puis résoudre...

En effet, j'ai suivis ce tuto pour apprendre quelques techniques sur les volet glissant en css:
http://www.alsacreations.com/xmedia/tuto/exemples/accordeon/menu_demo.html

Ce que je voulais, c'est la même chose, mais en mettant le volet de haut en bas, sauf que...je n'arrive pas du tout au resultat attendu...

Voila les deux variantes que j'arrive a produire :
http://www.tera-imonium.net/test.php
http://www.tera-imonium.net/test2.php

Autrement dis, il me faudrais un peu des deux, mais je n'y arrive vraiment pas...

Si quelqu'un pouvait m'aider, ca m'arrangerais vraiment Smiley confused

Je vous remercie d'avance!
bonour,

en reprenant l'exemple : http://www.alsacreations.com/xmedia/tuto/exemples/accordeon/menu_demo.html

et en surchargeant par exemple la feuille de style comme ceci :
#navigation {width:auto;background: #000 url(menu-item.png) left bottom ;}
#navigation > li {display:inline-block;}
#navigation a {min-width:180px;}
#navigation .toggleSubMenu {position:relative;}
#navigation .subMenu {position:absolute;}


tu passe d'un menu deroulant vertical a horizontal avec un sous menu vertical.

pour un sous-menu horizontal aussi :
#navigation {width:auto;background: #000 url(menu-item.png) left bottom ;position:relative;}
#navigation  li {display:inline-block;box-shadow:4px 0 1px -2px  #555}
#navigation a {min-width:180px;}
#navigation .subMenu {position:absolute;left:0;min-width:100%;background: #000 url(menu-item.png) left bottom ;}


un autre exemple sans js : http://yidille.free.fr/plux/valign/?58-

Je ne comprend pas bien pourquoi ta structure HTML est si complexe/imbriquée et ou tu veut en venir en fait .

psite : le duo relatif/absolute, permet de positionné les enfants par rapport au parent .

cordialement.
Ma structure HTML est victime de mes expérience continu malheureusement!

Merci pour ton aide, je vais un peu étudier ca, mais pour le script sans js, il ne fonctionne pas sous IE et donc ne fait pas partie de mes possibilités Smiley ohwell