Strzałka - hover Opcje

[napixowany]

Witam, jeśli byłaby taka możliwość chciałbym prosić szanownych Użytkowników o poradę. Mam mały problem dotyczący zmieniania się obrazka po najechaniu myszką. Otóż posiadam taki kod:

[HTML] pobierz, plaintext 
<div id="colMenuCenter">
<ol>
<li><a href="#">Wydarzenia</a></li>
</ol>
</div>
[HTML] pobierz, plaintext 

oraz

[CSS] pobierz, plaintext 
#colMenuCenter li { list-style-type: none; padding: 5px 0px; }
#colMenuCenter li a { width: 156px; height: 14px; margin: 0 auto; padding: 3px 10px; display: block; text-decoration: none; }
#colMenuCenter li a:hover { background-color: #352b2a; color: #feffff; text-decoration: none; }
[CSS] pobierz, plaintext 

Oprócz zmiany koloru tła zależałoby mi na tym żeby wstawić przed napisem wydarzenia taką strzałkę dla a:

(IMG:http://dps-nowawies.nstrefa.pl/li.png)

oraz dla a:hover taką:

(IMG:http://dps-nowawies.nstrefa.pl/li2.png)

Strzałki nr 2 nie widać gdyż jest białego koloru (strzałka nr1 - li.png, strzałka nr2 - li2.png). Czy jest jakaś możliwość zrobienia tego bez ustalania tła jako np. jpg z tą strzałką? Proszę o pomoc. Pozdrawiam i z góry dziękuje.

Ten post edytował napixowany 19.09.2010, 19:31:56

[Blame]

Możesz skorzystać z pseudoelementu :before, ale nie obsługują go starsze przeglądarki (IMG:style_emoticons/default/winksmiley.jpg)

Ten post edytował Blame 19.09.2010, 19:31:51