Bonjour,
Je suis sur la réalisation de mon second site, en local avec Thelia 1.5.4. Pour le premier il n'y avait pas encore les grid donc c'est l'inconnu pour moi
Je souhaite aligner proprement mon menu horizontal, avec des espaces identiques entre chaque composant.
Ce qui me pose surtout souci, c'est le composant qui vient de la boucle RUBRIQUE qui me chamboule tout.
Voici le code de ma page menu :
<div id="nav" class="grid_12">
<div class="rfloat">
</div>
<div id="chemin" class="grid_3">
<a href="#URLSOMMAIRE">ACCUEIL</a> <!-- ::accueil:: -->
</div>
<div id="chemin" class="grid_1">
<a href="template/concept.html">CONCEPT</a> <!-- ::page concept:: -->
</div>
<div id="chemin" class="grid_1">
<a href="template/abonnement.html">S'ABONNER</a> <!-- ::page s'abonner:: -->
</div>
<ul class="primnav">
<THELIA_MENU_RUBRIQUES type="RUBRIQUE" classement="manuel" parent="0">
<li>
<a href="#URL" #FILTRE_egalite(#RUBRIQUE_RACINE||#ID||class="selection")>#TITRE</a>
</li>
</THELIA_MENU_RUBRIQUES>
</ul>
<div id="chemin" class="grid_1">
<a href="www.monsite.com/blog">BLOG</a>
</div>
<div class="push"></div>
</div>
Et mon code CSS :
#nav {
border-top: 1px solid #E7E7E8; /* Couleur (gris) du trait sous le logo, haut dessus du menu, sur toute la largeur du site */
border-bottom: 0px solid #E65596; /* Couleur (rose) du trait sous le menu, toute la largeur du site */
padding-top: 10px;
padding-bottom: 0px;
margin-top: -40px;
margin-bottom: 5px;
/* background-image: url(../_gfx/menu-repeat.jpg); /* Barre sous traduction */
background-repeat: repeat-x;
background-position: bottom;
}
#nav .icone {
margin-top: -5px;
}
.primnav .selection {
font-weight: bold;
}
.primnav {
font-size: 1em;
line-height: 1.2em;
}
.primnav li {
display: inline;
border-right: 1px solid #B85219;
float: left;
list-style-type: none;
}
.primnav li a {
display: block;
color: #505052;
text-transform: uppercase;
text-decoration: none;
padding-left: 20px; /* Permet de ne pas coller le mot S'ABONNER du menu */
padding-right: 0px;
font-size: 1em;
font-weight:bold; /* graisse texte titres des rubriques qui apparaissent dans menu */
}
.primnav li:last-child {
border-right: none;
}
.primnav li .sousnav {
font-size: .8em;
line-height: 1em;
display: none;
width: 1024px;
margin: 3px auto;
}
.primnav li .sousnav .sousnavsep {
margin: 0;
padding: 0;
}
.primnav li .sousnav .grid_3 {
margin-bottom: 5px;
}
.primnav li .sousnav .ulsousnav li {
list-style-type: none;
border: 0;
display: list-item;
width: 100%;
}
.primnav li .sousnav a {
margin: 3px 0 3px 0;
display: inline-block;
line-height: 1em;
text-transform: none;
}
.primnav li .sousnav h3 {
font-weight: bold;
}
.primnav li:hover .sousnav {
display: block;
text-transform: none;
}
.primnav .grid_sousnav {
position: absolute;
left: 0;
}
.primnav .sousnav .sousnav_wrap {
border-top: none;
padding-top: 10px;
padding-bottom: 2px;
background-color: #E5E5E5;
opacity: .95;
filter:alpha(opacity=95);
-moz-opacity:0.95;
opacity:0.95;
width: 1005px;
margin-bottom: 0;
border-left: 2px solid #ccc;
border-right: 2px solid #ccc;
border-bottom: 2px solid #ccc;
}
#nav .sousnav a.voirtous {
text-decoration: underline;
color: #B85219;
}
Quelqu'un peu m'aider ?
Merci d'avance !
Last edited by choupette (21-10-2014 20:08:26)