[Yvan]

Bon, je bidouille, mais ça avance pas vite !
J'ai réussi à avoir des boutons de taille variable, mais les éléments de la liste ne passent pas à la ligne et se mettent à la suite les uns des autres, tant qu'ils en ont la place, ce qui est très moche. Et je ne comprends pas pourquoi ils ne passent pas à la ligne ! Les éléments d'une liste, ça passe normalement tjs à la ligne, non ? Sauf si on spécifie 'display:inline;'...

Un autre truc qui me dérange est que la bulle s'affiche par-dessus le texte du site sans effet de transparence alors qu'elle s'affiche avec 100% de transparence au-dessus du menu.

Voyez par vous-mêmes:

www.coord21.ch/test_cmsms

Et voici tout le code:

#menuwrapper {
width: 95%;
margin-left: 0px;
margin-bottom: 10px;
}
#primary-nav, #primary-nav ul {
list-style: none;
margin: 0px;
padding: 0px;
width: auto;
margin-left: 1px;
}

#primary-nav li {
margin-bottom: -1px;
position: relative;
padding: 0px 0px 4px 0px;
}

#primary-nav li li {
width: 190px;
padding: 0px 10px;
background-image: none;
}
ul#primary-nav li a {
display: block;
font-size: 1em;
font-weight: normal;
color: black;
padding: 0.3em 0.8em 0.3em 0.8em;
text-decoration: none;
}
ul#primary-nav a span {
display: block;
line-height: 1.2em;
padding-left: 1.5em;
}
ul#primary-nav li a:hover {
color: RGB(0,130,220);
}
ul#primary-nav li li a:hover {
background-color: RGB(0, 130, 220);
color: white;
}
ul#primary-nav li a.menuactive {
color: RGB(90, 180, 0);
font-weight: bold;
}
ul#primary-nav li li a.menuactive {
background-color: RGB(90, 180, 0);
color: white;
}
ul#primary-nav li ul a {
text-align: left;
margin: 0px;
position: relative;
padding: 6px;
font-weight: normal;
color: #000;
background: none;
}
ul#primary-nav li ul {
list-style-type: none;
width: 209px;
height: auto;
margin: 0px 0px 0px 0px;
padding: 10px 0px 0px;
position: absolute;
left: 100%;
top: -10px;
display: none;
background: url(uploads/ngrey/ultoprt.png) no-repeat left top;
}
ul#primary-nav li ul ul {
list-style-type: none;
margin: 0px 0px 0px -8px;
padding: 0px;
padding-top: 10px;
position: absolute;
width: 209px;
height: auto;
top: -5px;
left: 100%;
display: none;
background: url(uploads/ngrey/ultoprt.png) no-repeat left top;
}
* html ul#primary-nav li ul {
background: url(uploads/ngrey/ultoprt.gif) no-repeat left top;
}
* html ul#primary-nav li ul ul {
background: url(uploads/ngrey/ultoprt.gif) no-repeat left top;
}
#primary-nav ul li.separator, #primary-nav .separator:hover {
width: 209px;
padding: 0px;
height: 9px;
margin: 0px 0px -9px;
background: url(uploads/ngrey/ulbtmrt.png) no-repeat left bottom;
}
* html #primary-nav li ul li.separator {
height: 2px;
background: url(uploads/ngrey/ulbtmrt.gif) no-repeat left bottom;
}
#primary-nav li, #primary-nav li.menuparent {
min-height: 1em;
}
#primary-nav li li.menuactive a.menuactive {
color: #FFF;
font-weight: normal;
background: url(uploads/ngrey/darknav.png) repeat-x left center;
}
#primary-nav li.menuparent span {
padding-left: 1.5em;
background: url(uploads/ngrey/active.png) no-repeat left center;
}
#primary-nav li.menuparent:hover li.menuparent span {
padding-left: 0;
background: url(uploads/ngrey/parent.png) no-repeat right center;
}
#primary-nav li.menuparenth li.menuparent span,
#primary-nav li.menuparenth li.menuparenth span {
padding-left: 0;
background: url(uploads/ngrey/parent.gif) no-repeat right center;
}
#primary-nav li.menuparent:hover span,
#primary-nav li.menuparent.menuactive span,
#primary-nav li.menuparent.menuactiveh span,
#primary-nav li.menuparenth span {
background: url(uploads/ngrey/parent.png) no-repeat left center;
}
#primary-nav li li span,
#primary-nav li.menuparent li span,
#primary-nav li.menuparent:hover li span,
#primary-nav li.menuparenth li span,
#primary-nav li.menuparenth li.menuparenth li span,
#primary-nav li.menuparent li.menuparent li span,
#primary-nav li.menuparent li.menuparent:hover li span {
background: none;
padding-left: 0px;
}
/* Styling the appearance of menu items on hover */
#primary-nav li:hover li a,
#primary-nav li.menuh li a,
#primary-nav li.menuparenth li a,
#primary-nav li.menuactiveh li a {
background: none;
color: #000;
}
#primary-nav ul,
#primary-nav li:hover ul,
#primary-nav li:hover ul ul,
#primary-nav li.menuparenth ul,
#primary-nav li.menuparenth ul ul {
display: none;
}
#primary-nav li:hover ul,
#primary-nav ul li:hover ul,
#primary-nav ul ul li:hover ul,
#primary-nav li.menuparenth ul,
#primary-nav ul li.menuparenth ul,
#primary-nav ul ul li.menuparenth ul {
display: block;
}
#primary-nav li, #primary-nav li.menuparenth {
float: left;
height: 1%;
}
#primary-nav li a {
height: 1%;
}
#primary-nav li.sectionheader {
border-left: 1px solid #006699;
border-top: 1px solid #006699;
font-size: 130%;
font-weight: bold;
padding: 1.5em 0 0.8em 0.5em;
background-color: #fff;
margin: 0;
width: 100%;
}
#primary-nav li hr.separator {
display: block;
height: 0.5em;
color: #abb0b6;
background-color: #abb0b6;
width: 100%;
border: 0;
margin: 0;
padding: 0;
border-top: 1px solid #006699;
border-right: 1px solid #006699;
}

S'il vous plaît, aidez-moi ! J'en peux plus de ce menu !