[CSS] Przeglądarka nie stosuje atrybutów. Opcje

[thomson89]

Witam!

Za pomocą list definicyjnych wykonałem takie proste menu:

[HTML] pobierz, plaintext 
<dl id="menu">	
	<dt><a href=""><img src="menu/strona_glowna1.png" onmouseover="this.src='menu/strona_glowna2.png'" onmouseout="this.src='menu/strona_glowna1.png'"></a></dt>
 
	<dt><a href=""><img src="menu/aktualnosci1.png" onmouseover="this.src='menu/aktualnosci2.png'" onmouseout="this.src='menu/aktualnosci1.png'"></a></dt>
 
	<dt><a href=""><img src="menu/wspolpraca1.png" onmouseover="this.src='menu/wspolpraca2.png'" onmouseout="this.src='menu/wspolpraca1.png'"></a></dt>
 
	<dt><a href=""><img src="menu/kontakt1.png" onmouseover="this.src='menu/kontakt2.png'" onmouseout="this.src='menu/kontakt1.png'"></a></dt>
 
 
 
	<dt class="first_button"><img src="menu/pamiatki_sakralne1.png" onmouseover="this.src='menu/pamiatki_sakralne2.png'" onmouseout="this.src='menu/pamiatki_sakralne1.png'"></dt>
		<dd><a href="">Element 1.1</a></dd>
		<dd><a href="">Element 1.2</a></dd>
		<dd class="last"><a href="">Element 1.3</a></dd>
 
 
	<dt><img src="menu/bizuteria1.png" onmouseover="this.src='menu/bizuteria2.png'" onmouseout="this.src='menu/bizuteria1.png'"></a></dt>
		<dd><a href="">Element 1.1</a></dd>
		<dd><a href="">Element 1.2</a></dd>
		<dd class="last"><a href="">Element 1.3</a></dd>
 
 
 
	<dt class="first_button"><img src="menu/twoje_konto1.png" onmouseover="this.src='menu/twoje_konto2.png'" onmouseout="this.src='menu/twoje_konto1.png'"></a></dt>
 
	<dt><a href=""><img src="menu/koszyk1.png" onmouseover="this.src='menu/koszyk2.png'" onmouseout="this.src='menu/koszyk1.png'"></a></dt>
 
 
 
	<dt class="first_button"><a href=""><img src="menu/zaloguj_sie1.png" onmouseover="this.src='menu/zaloguj_sie2.png'" onmouseout="this.src='menu/zaloguj_sie1.png'"></a></dt>
 
	<dt class="last_button"><a class="last_button" href=""><img class="last_button" src="menu/zarejestruj_sie1.png" onmouseover="this.src='menu/zarejestruj_sie2.png'" onmouseout="this.src='menu/zarejestruj_sie1.png'"></a><dt>
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
#menu a {
	color: black;
	text-decoration: none;
	border: 0px;
}
#menu a:hover img {
	border: none;
}
#menu a:hover {
	color: black;
	text-decoration: none;
	border-bottom: 1px dotted;
}
[HTML] pobierz, plaintext 

Ale niestety, #menu a:hover img, nie działa i obrazki mają dolne obramowanie, co nie jest u mnie pożądane.

Jak to naprawić?

[Meares]

Kod

text-decoration: none;

Jeśli chodzi o to o czym myślę. (IMG:style_emoticons/default/haha.gif)

[thomson89]

Nie...

Dodałem, specjalną klasę dla obrazków, aby nie miały obramowania po najechaniu na nie myszką, ale to nie działa. Obramowanie chcę zachować tylko dla linków dd. A dla obrazów w dt nie.

[seth-kk]

#menu a:hover - dodaje obramowanie do linka
#menu a:hover img - usowa obramowanie z obrazka w linku
uzyj dodatkowej klasy dla linkow z obrazkami

[thomson89]

Przykładowo, dałem:

[HTML] pobierz, plaintext 
<dt><a href="" class="cos"><img src="menu/kontakt1.png" onmouseover="this.src='menu/kontakt2.png'" onmouseout="this.src='menu/kontakt1.png'"></a></dt>
[HTML] pobierz, plaintext 

[HTML] pobierz, plaintext 
#menu .cos a:hover {
	border: 0;
}
[HTML] pobierz, plaintext 

->EDIT

dałem style lokalne i działa normalnie

[HTML] pobierz, plaintext 
style="border: 0;"
[HTML] pobierz, plaintext 

a jak zrobić w zewnętrznych?

Ten post edytował thomson89 30.10.2009, 17:08:55

[seth-kk]

podstawy:

[HTML] pobierz, plaintext 
a.cos:hover
[HTML] pobierz, plaintext 

a nie

[HTML] pobierz, plaintext 
.cos a:hover
[HTML] pobierz, plaintext 

i zwroc uwage na kolejnosc styli

[thomson89]

Dzięki.