CSS Fehler?

Sanes · 16 Juli 2009

Hallo leute :)

Also ich hab ein Problem mit meinem CSS file und zwar geht es um einen mouseover effekt.

styles.css:

Code:

div.button {
color: blue;
}
div.button:hover {
color: red;
}

index.html:

Code:

<head>
<title>Mouseover</title>
<LINK REL=StyleSheet HREF="styles.css" TYPE="text/css">
</head>
<body>
<div class=button>TEST</div>
</body>

Und zwar ist der Text zwar blau, aber wenn ich mit der Maus darüberfahre passiert nichts. Ich habe den Code auch schon validieren lassen und W3C hat keine Fehler gefunden :O

Danke

prm · 16 Juli 2009

Grundsätzlich ist der Hover-Effekt nur für Links vorgesehen.
Wenn das bei dir also ein Link sein soll, dann müsstest du die Formatierungen dem Element "a" zuweisen.

Ansonsten kann dir vielleicht dieser Trick weiterhelfen.

Sanes · 16 Juli 2009

Ok vielen dank für deine Antwort, jetzt hats geklappt :-o
ich hab den code einfach so abgeändert:

Html:

Code:

<body>
<a href=index.html class=button></div>
</body>

Css:

Code:

a.button {
color: blue;
}
a.button:hover {
color: red;
}
CODE]
 
 
Super!:smile:

Efchen · 16 Juli 2009

prm schrieb:
Grundsätzlich ist der Hover-Effekt nur für Links vorgesehen.

Seit wann soll das so sein? Du meinst, der IE6 kann :hover nur auf Links anwenden! Oder sitz ich grad im falschen Zug?

Sanes schrieb:
Also ich hab ein Problem mit meinem CSS file und zwar geht es um einen mouseover effekt.

Um Verwechslungen zu vermeiden, spricht man in CSS von einem "Hover-Effekt", angelehnt an die Pseuso-Klasse ":hover" und bei der JavaScript-Variante von einem "Mouseover-Effekt", dort angelehnt an den Event-Handler "onMouseOver".

prm · 16 Juli 2009

@Efchen:
Ja sorry, ich meinte den IE 6. Wie gut, dass es dich gibt

@Sanes:
Korrekt wäre es so:

Code:

<body>
<a href="index.html" class="button">Linktext</a>
</body>

CSS Fehler?

Sanes

Neues Mitglied

prm

Aktives Mitglied

Sanes

Neues Mitglied

Efchen

Guest

prm

Aktives Mitglied

Neueste Beiträge