[Résolu] Liste à puce : Dernier élément différent

Salut à tous,

Pour réaliser un menu horizontal j'utilise des liste à puce. Entre chaque "item" du menu il y'a une image de séparation.
Je voudrais cependant que pour le dernier élément de ma liste cette image n'apparaisse pas. je n'arrive pas a trouver de solutions fonctionelles.

Voici le menu :


Et mon code :
html

<div class="mf_menu" id="menu_footer">
		<ul>
			<li><a href="#">ACCUEIL</a></li>
			<li><a href="#">ACTUALITES</a></li>
			<li><a href="#">EMISSIONS</a></li>
			<li><a href="#">TESTS</a></li>
                </ul>
</div>

Et le css :

#menu_footer ul {
				list-style-type: none;
				width: 100%;
				}
				#menu_footer li {
					float: left;
					background:url(struct/menu_footer_sep.gif) no-repeat right top;
					display:inline;
				}
				#menu_footer li a {
					float: left;
					margin: 0 2px 0 0;
					padding-left:3px;
					padding-right:3px;
					text-align: center;
					text-decoration: none;
					color: #ffffff;
					font-weight: bold; 
					font-family: arial; 
					font-size: 8.5pt;
					background-position:0 0;
					background-repeat:no-repeat;
				}

Modifié par GrUnK (28 Aug 2007 - 09:27)

Salut à toi ,

tu pourrais par exemple affecter une classe à ton dernier li (soit directement dans ton code html soit en le déterminant si tu remplis ton ul via PHP) :

[b]html :[/b]
<li class="nosep"><a href="#">TESTS</a></li>

[b]css :[/b]
#menu_footer li.nosep {
	float: left;
	background:none;
	display:inline;
}

A+

Merci bien
C'est ce que j'avais essayer de faire mais je m'était un peu embrouiller au niveau des selecteur
Modifié par GrUnK (28 Aug 2007 - 09:28)

De rien,

et au passage, un petit récapitulatif sur les sélecteurs .


*Edit: et après une bonne nuit de sommeil, je me rends compte qu'il suffit de mettre

#menu_footer li.nosep {
	background:none;
}

Modifié par Heyoan (28 Aug 2007 - 10:38)