AVANT DE COMMENCER A UTILISER LES RUBRIQUES DÉROULANTES SACHEZ QUE DEPUIS LES MODIFICATIONS D'EKLABLOG CE CODE COMPORTE DES ERREURS, ON M'A DEMANDÉ COMMENT FAIRE DONC JE VOUS DONNE LES CODES MAIS JE PRÉFÈRE VOUS PRÉVENIR AVANT !
On commence par le HTML :
<div class="navbar">
<div class="nav" style="text-align: center;">TITRE</div>
<div class="navig" style="text-align: center;"><a href="URL LIEN 1">TITRE 1</a> <a href="LIEN URL 2">TITRE 2</a> <a href="LIEN URL 3">TITRE 3</a></div>
</div>
Plus vous voulez rajouter de lien plus vous devez ajouter ceci <a href="LIEN URL">TITRE </a>.
Puis le CSS :
.navbar {
width:Xpx;
height:Xpx; <--- c'est cette valeur qui fait buguer le code depuis le "nouveau" Ekla
overflow:hidden;
-webkit-transition: all 2s ease;
-moz-transition: all 2s ease;
-o-transition: all 2s ease
}
.navbar:hover{
height:Xpx;
}
.nav {
font-family:POLICE;
text-transform:POLICE;
font-size:Xpx;
margin-bottom:Xpx;
margin-top:Xpx;
text-align:center;
background-color:COULEUR;
color:COULEUR;
width:Xpx;
display:block;
opacity:1;
}
.navig a{
letter-spacing:Xpx;
font-family:POLICE;
text-transform:POLICE;
font-size:Xpx;
text-align:center;
margin-bottom:Xpx;
background-color:COULEUR;
color:COULEUR;
border-left:Xpx solid COULEUR;
border-right:Xpx solid COULEUR;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
display:block;
padding:Xpx;
padding-right:Xpx;
}
.navig a:hover{
background-color:COULEUR;
color:COULEUR;
border-right:Xpx solid COULEUR;
border-left:Xpx solid COULEUR;
letter-spacing:Xpx;
text-align:center;
padding-left:Xpx;
}
Remplacez les X par des valeurs. C'est à vous de tester, ça serait trop facile si le code était fourni avec toutes les valeurs.