✔ Verlinkung

[tamilsuriyan]

Hallo zusammen,

.buttonTest{
width: 125px;
border: 1px solid gray;
text-align: center;
padding: 10px 10px 10px 0;
font: 10px Verdana, Geneva, Arial, Helvetica, sans-serif;
color: black;
}
.buttonTest .inline_img{
vertical-align: middle;
border: none;
}

<a href="<%= response.encodeURL("test1.jsp") %>"><div class="buttonTest"><img src="hello.png" border="0"><br>Test Link</div></a>

Dieser Code funktioniert nicht mit IE6. Das Bild wird nicht verlinkt. Das Rahmen außen ist verlinkt, aber es zeigt den normalen Cursor und nicht den Hand-Cursor (Pointer), obwohl es verlinkt ist. Es funktioniert mit IE7, FireFox, Opera und co nur nicht mit IE6. Was kann man da machen?

 

[Maik]

Hi,

setz es folgendermaßen um, denn Inline-Elemente (= a) dürfen überhaupt keine Block-Elemente (= div) enthalten.

<a href="<%= response.encodeURL("test1.jsp") %>" class="buttonTest"><img src="hello.png" border="0" class="inline_img"><br>Test Link</a>

.buttonTest{
display:block; /* verleiht dem Inline-Element "Block-Level-Charakteristika" */
width: 125px;
border: 1px solid gray;
text-align: center;
padding: 10px 10px 10px 0;
font: 10px Verdana, Geneva, Arial, Helvetica, sans-serif;
color: black;
}

mfg Maik

 

[tamilsuriyan]

Danke. Das hat mir weiter geholfen und sorry wegen Forum - Bereich. Wusste nicht, ob es ein HTML oder CSS Problem war, deshalb hab ich es in HTML Bereich geschrieben.

 

[tamilsuriyan]

.buttonTest{
	border: 1px solid gray;
       display:block;
	text-align: center;
	width: 125px; 
	color: black;
	padding: 10px 10px 10px 0;
	font: 10px Verdana, Geneva, Arial, Helvetica, sans-serif;
	cursor: pointer;
}
.buttonTest .inline_img{
	vertical-align: middle;
	border: none;
}
a, span, .buttonTest{
  text-decoration:none;
}
a:hover .buttonTest{
	border: 1px solid black;
	background-color: #F0F8FF;
}

Warum wird die Farbe nicht ändert, wenn man auf das link drauf (hover) geht? Im HTML Code hab ich den class so wie Maik das geschrieben hat in Elemente (= a) gesetzt. Bevor ich das umgeändert ging das. Das ganze Feld innerhalb von dem Rahmen mit dem Farbe #F0F8FF angezeigt.

 

[Maik]

Hi,

der Selektor muß so lauten:

a.buttonTest:hover{
	border: 1px solid black;
	background-color: #F0F8FF;
}

mfg Maik

 

[tamilsuriyan]

danke das funktioniert nur mit IE. Mit Firefox geht das nciht.

 

[Maik]

Das wäre mir neu, dass der Selektor vom FF nicht interpretiert wird - bei mir funktioniert das Stylesheet browserübergreifend einwandfrei.

mfg Maik