Sorry, zuviel Kaffee: (rauskopiert und angepasst und nicht aufgepasst..)
#navi li { background: url(A.png);}
#navi li a { }
#navi li a:hover { background: url(A_hover.png);}
#navi li .nav-selected { background: url(A_hover.png); }
#navi li:first-child { background: url(C.png);}
#navi li:first-child:hover { background: url(C_hover.png);}
#navi li .nav-selected:first-child { background: url(C_hover.png);}
>
> Das erste Element soll die Grafik C und C\_hover erhalten, - alle anderen A und A\_hover.
>
»»
So gehts: (kompletter Codeschnippsel)
~~~css
#navi li { display: block; float:left; text-align: center; vertical-align: center; font-weight: normal; color: #404040; width: 200px; height: 60px; background: url(fx_img/nav_button_back.png);}
#navi li a { display: block; text-decoration: none; color: #fff; width: 200px; height: 60px; line-height: 60px; font-weight: bold; }
#navi li a:hover { color: #fff; background: url(fx_img/nav_button_back_h.png) no-repeat;}
#navi li .nav-selected { color: #fff; background: url(fx_img/nav_button_back_s.png); }
#navi li:first-child { background: url(fx_img/nav_button_back_f.png); font-size: 0;}
#navi li:first-child :hover{ background: url(fx_img/nav_button_back_fh.png); font-size: 0;}
#navi li:first-child .nav-selected { background: url(fx_img/nav_button_back_f.png); font-size: 0;}
#navi li:first-child .nav-selected:hover { background: url(fx_img/nav_button_back_fh.png); font-size: 0;}
Danke nochmal!