Menu na stronę - podświetlanie - pomóżcie :)

Grzesiek [ www na-skroty pl ]

Menu na stronę - podświetlanie - pomóżcie :)

Przerabiam sobie menu i taka mała kosmetyczna sprawa mnie boli.

Mianowicie standardowe menu na podstawie listy (ul/li):

Problem zobrazowany tutaj --->

1. Belka w spoczynku :D

2. Podświetlenia prawego linku. (Tutaj tkwi problem).

3. Podświetlenie lewego linku.

4. Tak jakbym chciał, by prawe linki się podświetlały.

Widać zatem, że problem tkwi w separatorze linków. Przy najeżdżaniu na linki, obrazek o te dwa piksele za bardzo na lewo się rozszerza.


Tutaj jest fragment mojego CSS'a:


#menu_f ‹
width: 920px;
height: 25px;
margin: 0px auto 1px auto;
›

#menu_f ul ‹
margin: 0px;
padding: 0px;
list-style: none;
›

#menu_f li ‹
display: inline;
›



#menu_f a ‹
display: block;
float: left;
height: 18px;
padding: 4px 16px 3px 18px;
background: url(../images/homepage04.gif) no-repeat left center;
›

#menu_f ul li a:hover
‹
background: url(../images/homepage03_hover.gif) repeat-x;
width:inherit;
›

#menu_f .first a ‹
background: none;
›

Pewnie to coś błahego, ale ja póki co nie potrafię zdiagnozować problemu :)


Edit:
Po zmienieniu na:
background: url(../images/homepage03_forum_hover.gif) repeat-x -0px 5px;
czyli przesunięcie hoveru w pionie o 5px
zauważyłem, że separator w ógole znika po najechaniu.

07.02.2008

15:05

[2]

Grzesiek [ www na-skroty pl ]

Ślepy jestem :P

Przecież separator zawiera się w definicji odnośnika, a ja jego nie uwzględniam przy a:hover.