Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów
Problem z położeniem tekstu - Wersja do druku

+- Forum Webmastera, HTML, CSS, PHP, MySQL, Hosting, Domeny - Forum dla Webmasterów (https://www.webmastertalk.pl)
+-- Dział: Technologie internetowe - tworzenie stron WWW (https://www.webmastertalk.pl/forum-technologie-internetowe-tworzenie-stron-www)
+--- Dział: xHTML, CSS, JavaScript (https://www.webmastertalk.pl/forum-xhtml-css-javascript)
+--- Wątek: Problem z położeniem tekstu (/thread-problem-z-polozeniem-tekstu)

Problem z położeniem tekstu - frankd - 12-10-2009

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;
}


RE: Problem z położeniem tekstu - Labsta.com - 12-10-2009

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.

RE: Problem z położeniem tekstu - frankd - 12-10-2009

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".

RE: Problem z położeniem tekstu - Labsta.com - 12-10-2009

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.

RE: Problem z położeniem tekstu - frankd - 12-10-2009

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

RE: Problem z położeniem tekstu - Labsta.com - 12-10-2009

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>

RE: Problem z położeniem tekstu - frankd - 13-10-2009

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