[RESOLU] Menu horizontal avec double bordure de couleur diférente

[sheitaneb]

Par ftp ???
Non, par l'administration du site, Disposition » Gestion de Menu.

et bien je le fait par ftp car via l'admin gestion de menu on ne peut pas éditer les templates il me semble !?



j'ai fait les modifications que tu m'a indiqués, j'ai aussi regarder la class dans le code source qui est comme tu le dit qu'un numéro
sauf sur la page active.

pour le moment j'essaie sans ajouter menu ou autre dans la class.


j'ai donc mis dans ma feuille de style

.1 {color: green;} marche pas

et

#primary-nav li.1 a {color: green;} marche pas

je met mon template et un bout de ma feuille de style
pour que tu te rende compte:

Code :

{* CSS classes used in this template:
#menuwrapper - The id for the <div> that the menu is wrapped in. Sets the width, background etc. for the menu.
#primary-nav - The id for the <ul>
.menuparent - The class for each <li> that has children.
.menuactive - The class for each <li> that is active or is a parent (on any level) of a child that is active. *}

{assign var='number_of_levels' value=10000}
{if isset($menuparams.number_of_levels)}
  {assign var='number_of_levels' value=$menuparams.number_of_levels}
{/if}

{if $count > 0}
<div id="menuwrapper">
<ul id="primary-nav">
{foreach from=$nodelist item=node}
{if $node->depth > $node->prevdepth}
  {repeat string='<ul class="unli">' times=$node->depth-$node->prevdepth}
{elseif $node->depth < $node->prevdepth}
  {repeat string='</li><li class="separator once" style="list-style-type: none;">&nbsp;</li></ul>' times=$node->prevdepth-$node->depth}
  </li>
  {elseif $node->index > 0}</li>
{/if}
{if $node->parent == true or $node->current == true}
  {assign var='classes' value='menuactive'}
  {if $node->parent == true}
    {assign var='classes' value='menuactive menuparent'}
  {/if}
  {if $node->children_exist == true and $node->depth < $number_of_levels}
    {assign var='classes' value=$classes|cat:' parent'}
  {/if}
  {if $node->type == 'sectionheader'}
    <li class="{$classes}"><a class="{$classes}"><span class="sectionheader">{$node->menutext}</span></a>
  {else}
    <li class="{$classes}{$node->hierarchy}"><a class="{$classes}{$node->hierarchy}"
  {/if}
{elseif $node->type == 'sectionheader' and $node->haschildren == true}
  <li><a ><span class="sectionheader">{$node->menutext}</span></a>
{elseif $node->type == 'sectionheader'}
  <li><a ><span class="sectionheader">{$node->menutext}</span></a>
{elseif $node->type == 'separator'}
  <li style="list-style-type: none;"> <hr class="menu_separator" />
{elseif $node->children_exist == true and $node->depth < $number_of_levels and $node->type != 'sectionheader' and $node->type != 'separator'}
  <li class="menuparent"><a class="menuparent"
{else}
  <li classe="{$node->hierarchy}">
  <a classe="{$node->hierarchy}"  
{/if}
{if $node->type != 'sectionheader' and $node->type != 'separator'}
{if $node->target}target="{$node->target}" {/if}
href="{$node->url}"><span>{$node->menutext}</span></a>
{/if}
{/foreach}
{repeat string='</li><li class="separator once" style="list-style-type: none;">&nbsp;</li></ul>' times=$node->depth-1}
</li>
</ul>
<div class="clearb"></div>
</div>
{/if}

Code :

/* ------------  Menu  ROOT  ------------ */
.page-menu {
    width: auto;
    height: 40px;
        background-color: pink;
}
.menuwrapper {}

.1 {color: green;}
.2 {color: blue;}
.3 {color: #eed740;}
.4 {color: #FF358B;}
.5 {color: yellow;}

ul#primary-nav li hr.menu_separator{
        position: relative;
        visibility: hidden;
        display:block;
}
.page-menu ul#primary-nav {
    float: left;
    list-style: none;
    padding: 0;
    margin: 0;
}
.page-menu ul#primary-nav li {
    float: left;
}
.page-menu ul#primary-nav li a,
.page-menu ul#primary-nav li a span {
    display: block;
    padding: 0 35px;
    background-repeat: no-repeat;
    background-color: transparent;
}
.page-menu ul#primary-nav li a {
        padding-left: 0;
    color: #454545;
    font-weight: normal;
        text-decoration: underline;
    font-size: 1.2em;
}
.page-menu ul#primary-nav li a:hover,
.page-menu ul#primary-nav li a:active {
    color: #000;
}
.page-menu ul#primary-nav li a.menuactive,
.page-menu ul#primary-nav li a:hover span {
    color: #000;
}
.page-menu ul#primary-nav li a.menuparenth,
.page-menu ul#primary-nav li a.menuactive,
.page-menu ul#primary-nav li a:hover,
.page-menu ul#primary-nav li a:focus,
.page-menu ul#primary-nav li a:active {
    background-position: 100% -120px;
}
.page-menu ul#primary-nav li a {
    background-position: 100% -80px;
}
.page-menu ul#primary-nav li a.menuactive span,
.page-menu ul#primary-nav li a:hover span,
.page-menu ul#primary-nav li a:focus span,
.page-menu ul#primary-nav li a:active span {
    background-position: 0 -40px;
}
.page-menu ul#primary-nav li a span {
    background-position: 0 0;
}
.page-menu ul#primary-nav .sectionheader,
.page-menu ul#primary-nav li a:link.menuactive,
.page-menu ul#primary-nav li a:visited.menuactive {
/* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.page-menu ul#primary-nav li span,
.page-menu ul#primary-nav li a,
.page-menu ul#primary-nav li a:hover,
.page-menu ul#primary-nav li a:focus,
.page-menu ul#primary-nav li a:active {
/* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
/* Additional IE specific bug fixes... */
* html .page-menu ul#primary-nav {
    display: inline-block;
}
*:first-child+html .page-menu ul#primary-nav {
    display: inline-block;
}
/* --------------------  menu dropdow  -------------------------
/* Unless you know what you do, do not touch this */
/* Reset all ROOT menu styles. */
ul#primary-nav ul.unli li li a span,
ul#primary-nav ul.unli li a span,
ul#primary-nav .menuparent .unli .menuparent .unli li a span {
    font-weight: normal;
    background-image: none;
    display: block;
    padding-top: 0px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
}
#primary-nav {
    margin: 0px;
    padding: 0px;
}
#primary-nav ul {
    list-style: none;
    margin: -6px 0px 0px;
    padding: 0px;
/* Set the width of the menu elements at second level. Leaving first level flexible. */
    width: 209px;
}
#primary-nav ul {
    position: absolute;
    z-index: 1001;
    top: auto;
    display: none;
    padding-top: 9px;
    background: url([[root_url]]/uploads/NCleanBlue/ultop.png) no-repeat left top;
}
* html #primary-nav ul.unli {
    padding-top: 12px;
    background: url([[root_url]]/uploads/NCleanBlue/ultop.gif) no-repeat left top;
}
#primary-nav ul.unli ul {
    margin-left: -7px;
    left: 100%;
    top: 3px;
}
* html #primary-nav ul.unli ul {
    margin-left: -0px;
}
#primary-nav li {
    margin: 0px;
    float: left;
}
#primary-nav li li {
    margin-left: 7px;
    margin-top: -1px;
    float: none;
    position: relative;
}
/* Styling the basic appearance of the menu elements */
ul#primary-nav ul hr.menu_separator{
        position: relative;
        visibility: visible;
        display:block;
        width:130px;
           height: 1px;
           margin: 2px 30px 2px;
    padding: 0em;
    border-bottom: 1px solid #ccc;
    border-top-width: 0px;
    border-right-width: 0px;
    border-left-width: 0px;
    border-top-style: none;
    border-right-style: none;
    border-left-style: none;
}
#primary-nav .separator,
#primary-nav .separatorh {
    height: 9px;
    width: 209px;
    margin: 0px 0px -8px;
    background: url([[root_url]]/uploads/NCleanBlue/ulbtm.png) no-repeat left bottom;
}
* html #primary-nav .separator {
       z-index:-1;
    background: url([[root_url]]/uploads/NCleanBlue/ulbtm.gif) no-repeat left bottom;
}
*:first-child+html #primary-nav .separator {
       z-index:-1;
}
#primary-nav ul.unli li a {
    padding: 0px 10px;
    width: 165px;
    margin: 5px;
    background-image: none;
}
* html #primary-nav ul.unli li a {
    padding: 0px 10px 0px 5px;
    width: 165px;
    margin: 5px 0px;
}
#primary-nav li li a:hover {
    background-color: #DBE7F2;
}
/* Styling the basic appearance of the active page elements (shows what page in the menu is being displayed) */
#primary-nav li.menuactive li a {
    text-decoration: none;
    background: none;
}
#primary-nav ul.unli li.menuparenth,
#primary-nav ul.unli a:hover,
#primary-nav ul.unli a.menuactive {
    background-color: #DBE7F2;
}
/* Styling the basic apperance of the menuparents - here styled the same on hover (fixes IE bug) */
#primary-nav ul.unli li .menuparent,
#primary-nav ul.unli li .menuparent:hover,
#primary-nav ul.unli li .menuparent,
#primary-nav .menuactive.menuparent .unli .menuactive.menuparent .menuactive.menuparent {
    background-image: url([[root_url]]/uploads/NCleanBlue/arrow.gif);
    background-position: center right;
    background-repeat: no-repeat;
}
/* The magic - set to work for up to a 3 level menu, but can be increased unlimited */
#primary-nav ul,
#primary-nav li:hover ul,
#primary-nav li:hover ul ul,
#primary-nav li:hover ul ul ul,
#primary-nav li.menuparenth ul,
#primary-nav li.menuparenth ul ul,
#primary-nav li.menuparenth ul ul ul {
    display: none;
}
#primary-nav li:hover ul,
#primary-nav ul li:hover ul,
#primary-nav ul ul li:hover ul,
#primary-nav ul ul ul li:hover ul,
#primary-nav li.menuparenth ul,
#primary-nav ul li.menuparenth ul,
#primary-nav ul ul li.menuparenth ul,
#primary-nav ul ul ul li.menuparenth ul {
    display: block;
}
/* IE Hacks */
#primary-nav li li {
    float: left;
    clear: both;
}
#primary-nav li li a {
    height: 1%;
}
/*************** End Menu *****************/

sa ne pourrait pas venir de la propriété background-color d'une div plus général qui fait confusion?