Problem z położeniem tekstu

[frankd]

Witam

Mam pewien problem z położeniem tekstu w komórce. Zamiast w środku, jest u góry (na środku). Nie mogę tego rozgryźć i proszę o pomoc. Pozdrawiam

html

Kod:

<tr><td width="149" align="center" class="menu"><a id="rollover" href="adres strony" />tekst</td></tr>

css

Kod:

.menu{
text-align:center;
height:36px;
font-size:10px;
}

.menu a#rollover{
display: block; width: 149px; height: 36px;
background: url(adres obrazka)
top left no-repeat;
color:#FFFFFF;
text-decoration: none;
}
.menu a:hover#rollover{
background-position: 0 -36px;
color:#DDDDDD;
text-decoration: none;
}

[Labsta.com]

Najpierw zamknij tag, czyli ma być tak:

Kod:

<tr><td width="149" align="center" class="menu"><a id="rollover" href="adres strony" />tekst</a></td></tr>

i sprawdź czy działa.

[frankd]

Bez zmian. Napiszę tak: Wszystko było w porządku, gdy miałem jedno tło pod linkiem, ale chciałem spróbować zrobić zmianę tła, pod kursorem myszki. Dlatego zacząłem mieszać w pliku css głównie. W stronie html dodałem tylko "id="rollover"" przy znaczniku "a".

[Labsta.com]

Ups nie zauważyłem, że masz tam jeszcze "/", miało być tak:

Kod:

<tr><td width="149" align="center" class="menu"><a id="rollover" href="adres strony" >tekst</a></td></tr>

EDIT:

a w CSS

Kod:

.menu{
text-align:center;
height:36px;
font-size:10px;
}

#rollover{
display: block;
width: 149px;
height: 36px;
background: url(adres obrazka) top left no-repeat;
color:#FFFFFF;
text-decoration: none;
}
#rollover:hover{
background-position: 0 -36px;
color:#DDDDDD;
text-decoration: none;
}

Pamiętaj też, że może być tylko jeden element na stronie z id="rollover". Nie wiem co jeszcze może być źle, z tego co widzę masz proste błędy i to może powodować problemy. Sprawdź stronę walidatorem.

[frankd]

też bez zmian:/

E:
przerobiłem swój css wg tego wzoru: http://grabun.com/teksty/przyklady/css-rollover/ i wszytsko było ok, tylko tekst wywałiło do górnej krawędzi komórki... i nie wiem czemu. Walidator nie wykrył błędów w css. Sprawdzane w IE i FF

[Labsta.com]

No teraz to chyba rozumiem już w czym rzecz:

Kod:

#rollover{
display: block;
width: 149px;
height: 36px;
line-height: 36px;
background: url(adres obrazka) top left no-repeat;
color:#FFFFFF;
text-decoration: none;
}

line-height: 36px; wyśrodkuje tekst, jeśli nie to pobaw się paddingami. Zauważ, że przukład z którego wkleiłeś sobie kod nie zawiera tekstu w <a>

BTW - tego tak się nie robi. Do menu stosuj listy <ul>, a jeśli coś ma być linkiem z tekstem to musisz zamykać go w tagu <a>

[frankd]

Dokładnie. Wszystko mam zamiar przerobić, bo stronke przerabiam stopniowo równocześnie z przyswajaniem css. Linku nie wklejam bo to strona komercyjna. Dzięki za pomoc