5
Indiquez l’intérêt que vous portez à cette question
0

Demande de renseignement

Bonjour,
Je fait un menu avec du css.
le Css fonctionne, mais le menu c’est pas se que j’attend.
Sa me liste toute les rubriques, la 1ere fonctionne bien, (déplie la rubrique) mais affiche toutes les suivantes qui sont dans la meme rubrique.
Rubrique 1 (contient toutes les rubriques qui doivent être afficher)
rubrique 2, deplie les sous rubrique si il y a.
rubrique 2, idem
etc........

Pouvez vous m’aider, je tourne en rond. Merci. (si j’ai bien formulé)

Mon code.

<div class="menu-accordeon">
<B_secteur>
<div class="menu rubriques">
        <h2><:rubriques:></h2>
        <ul>
        <BOUCLE_secteur(RUBRIQUES) {id_rubrique=1} {par num titre, titre} {0,1}>
                <B_sous_rubriques>
                        <ul>
                                <BOUCLE_sous_rubriques(RUBRIQUES) {id_parent} {par num titre, titre}>
                                        <li><a href="#URL_RUBRIQUE">[(#TITRE|couper{80})]</a><BOUCLE_re(BOUCLE_sous_rubriques)></BOUCLE_re></li>
                                                        <ul>
                                                                <BOUCLE-articles-sous-sous-rub(ARTICLES) {id_rubrique}>
                                                                        <li>
                                                                                <a href="#URL_ARTICLE">[(#TITRE|couper{80})]</a>
                                                                        </li>
                                                                </BOUCLE-articles-sous-sous-rub>
                                                        </ul>
                                </BOUCLE_sous_rubriques>
                        </ul>
                        </B_sous_rubriques>
                      </BOUCLE_secteur>
        </ul>
</div>
</B_secteur>
</div>

CSS

.menu-accordeon { padding:0; margin:0; list-style:none; text-align: center; width: 180px; } 
.menu-accordeon ul { padding:0; margin:0; list-style:none; text-align: center; } 
.menu-accordeon li { background-color:#729EBF; background-image:-webkit-linear-gradient(top, #729EBF 0%, #333A40 100%); background-image: linear-gradient(to bottom, #729EBF 0%, #333A40 100%); border-radius: 6px; margin-bottom:2px; box-shadow: 3px 3px 3px #999; border:solid 1px #333A40 }

/* fond sous menu */
.menu-accordeon li li { max-height:0; overflow: hidden; transition: all .5s; border-radius:0; background: #444; box-shadow: none; border:none; margin:0 }
.menu-accordeon a { display:block; text-decoration: none; color: #fff; padding: 8px 0; font-family: verdana; font-size:1.2em } 
.menu-accordeon ul li a, #menu-accordeon li:hover li a { font-size:1em } #menu-accordeon li:hover { background: #729EBF } 
.menu-accordeon li li:hover { background: #999; } 
.menu-accordeon ul li:last-child { border-radius: 0 0 6px 6px; border:none; } 
.menu-accordeon li:hover li { max-height: 15em; }