ripetere un'immagine all'interno di un menù

[albertogil]

ciao, ho intenzione di ripetere un'immg solo per un elemento del menù
attributi link:
ul#navigation li a {
display: block;
font-weight:bold;
text-shadow:1px 1px 1px #fff;
float:left;
width: 100px;
height: 35px;
color:#603d05;
background:transparent url(campo.png)no-repeat bottom right;}
.campi{ background:transparent url(campo.png)repeat-x bottom right;}

vorrei che l'immag sia presente in tutti gli elementi ma che si ripeta solo nel li campi. Nel foglio di stile cosa non va?...devo impostare altri attributi per la classe campi?
<ul id="navigation">
<li class="home"><a title="Home">Home</a>
<li class="campi"><a title="Campi">Campi</a>
<li class="cerca"><a title="cerca">cerca</a>
<li class="foto"><a title="foto">foto</a>
<li class="contatti"><a title="Contatti">Contatti</a>[/list]

[ratte]

o/ ! Hmmm.... prova una cosa di questo genere:

#navigation li {
	float:left;
}

#navigation li a {
	display: block;
	font-weight:bold;
	text-shadow:1px 1px 1px #fff;
	width: 100px;
	height: 35px;
	color: #603D05;

	background-image:url('campo.png');	
	background-position:right bottom;
}

.home a, .cerca a, .foto a, .contatti a {
	background-repeat: no-repeat;
}

.campi a {
	background-repeat: repeat-x;
}

<ul id="navigation">
	<li class="home"><a title="Home">Home</a>
	<li class="campi"><a title="Campi">Campi</a>
	<li class="cerca"><a title="cerca">cerca</a>
	<li class="foto"><a title="foto">foto</a>
	<li class="contatti"><a title="Contatti">Contatti</a>[/list]

o/ !