Hi zusammen,

Ich habe auf einem Bild ein Div Layer der mir bei on Hover und Active ein Hintergrundbild anzeigt sozusagen als Effekt.

Nun das Problem das Hintergrundbild von a:active , a:focus wird mir nun aber auch auf den normalen links angezeigt wenn sie active sind.

HTML-Code:

.sidebar a {
display: block;
width: 110px;
height: 90px;
margin-top: 15px;	
}

.sidebar a:active, a:focus {
display: block;
width: 110px;
height: 90px;
margin-top: 15px;
background: url(../images/sidebaractive.png);
}

.sidebar a:hover {
display: block;
width: 110px;
height: 90px;
margin-top: 15px;
background: url(../images/sidebarhover.png);
}

Hi,

dann spezifizier die Regel ausschließlich für diesen Link mittels eines ID-Bezeichners - also beispielsweise:

HTML-Code:

<div class="sidebar">
   <a href="#" id="bgImage">Link mit Hintergrundbild</a>
   <a href="#">Link ohne Hintergrundbild</a>
</div>

Code css:

1 2 3 4 5 6

.sidebar a#bgImage:hover { background: url(../images/sidebarhover.png); } .sidebar a#bgImage:active, .sidebar a#bgImage:focus { background: url(../images/sidebaractive.png); }

Die drei Pseudoklassen hast du in der falschen Reihenfolge genannt, und bei :focus das Elternelement .sidebar vergessen.

mfg Maik

Jo hat funktioniert vielen Dank