[HTML]Problem z znakiem specjalnym przed linkiem. Opcje

[Rajdon]

Witam, mam problem z znakiem specjalnym przed linkiem, za każdym razem efekt na stronie jest taki, ze znak specjalny jest w jednym wierszu a link w 2. Oczywiście chodzi o to żeby były w jednym.


Fragment kodu:

[HTML] pobierz, plaintext 
<TR>
  <TD class=main_menu onmouseover="bgColor='#f2f2f2'" onmouseout="bgColor='#ffffff'" bgColor=#ffffff>&raquo;<a href="...
[HTML] pobierz, plaintext 

Efekt jest mniej wiecej taki:

»
Link

Proszę o pomoc.

[Rajdon]

[HTML] pobierz, plaintext 
}
.main_menu {
  border-top-width: 1px;
  border-top-style: solid;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  border-top-color: #E8EBEF;
  font-family: Arial, Helvetica, sans-serif;
  color: #454545;
  text-align: left;
  vertical-aligment: bottom;
  font-size: 11px;
  height: 17px;
  padding-left: 4px;
  padding-bottom: 2px;
}
.main_menu_lnk:link{
  color: #454545;
  display: block;
  width: 100%;
  text-decoration: none;
}
[HTML] pobierz, plaintext 

[cniak]

[HTML] pobierz, plaintext 
}
.main_menu {
  border-top-width: 1px;
  border-top-style: solid;
  border-right-style: none;
  border-bottom-style: none;
  border-left-style: none;
  border-top-color: #E8EBEF;
  font-family: Arial, Helvetica, sans-serif;
  color: #454545;
  text-align: left;
  vertical-aligment: bottom;
  font-size: 11px;
  height: 17px;
  padding-left: 4px;
  padding-bottom: 2px;
}
.main_menu_lnk:link{
  color: #454545;
  display: block;
  width: 100%;
  text-decoration: none;
}
[HTML] pobierz, plaintext 

Troche masz tutaj dziwnie to zrobione, używaj skrótów to będziesz lepiej to widzieć, dlaczego masz .main_menu_lnk:link[b] a nie .main_menu_lnk a:link[/b]? Atrybut :link służy do pokazywania odwiedzonych już odnośników (IMG:style_emoticons/default/smile.gif) Na twoim miejscu zostawiłbym :link a ustawił kolor #454545 jako standard dla a i ustalił dla linków już odwiedzonych - :visited jakiś inny kolor (IMG:style_emoticons/default/smile.gif) Też nie wiem po co ustawiasz taki sam kolor dla .main_menu_lnk:link jak i .main_menu.

Tutaj masz w skrócie to jak moim zdaniem powinno Ci działać:

.main_menu {
border-top: 1px solid #E8EBEF;
font-family: Arial, Helvetica, sans-serif;
color: #454545;
text-align: left;
vertical-aligment: bottom;
font-size: 11px;
height: 17px;
padding-left: 4px;
padding-bottom: 2px;
}


.main_menu_lnk a:link{
color: #454545;
display: inline;
width: 100%;
text-decoration: none;
}



Jak widze w kodzie twoim takie cos:

[HTML] pobierz, plaintext 
      <TR>
      <TD class=main_menu onmouseover="bgColor='#f2f2f2'" onmouseout="bgColor='#ffffff'" bgColor=#ffffff><nobr>?<a href="#" title="Gry na Xbox 360" class=main_menu_lnk >Xbox 360</a></nobr></TD>
      </TR>
[HTML] pobierz, plaintext 

To poprostu zamiast onmouseover i onmouseout zrobiłbym to w CSS:

[HTML] pobierz, plaintext 
main_menu td {
background: white;
}
main_menu td:hover {
background: #f2f2f2;
}
[HTML] pobierz, plaintext 

white = #ffffff jak dobrze pamietam (IMG:style_emoticons/default/smile.gif)


Jeżeli nie chcesz co chwile powtarzać ? zrobiłbym to za pomocą małego obrazka:
(IMG:http://gospodarka.gazeta.pl/i/obrazki/wiadomosci/raquo_archiwum.gif)

i dodać to jako background:

main_menu_lnk a {
background: transparent url (ścieżka obrazka.png) no-repeat center left;
padding-left: 16px;
}

padding-left: 16 px; - odstęp tekstu 16 px od lewej strony tak aby był widoczny ten obrazek ( który ma 14px)


Ten post edytował cniak 8.07.2010, 20:18:48