CSS3 Eigenschaft unabsichtlich oder ein Firefox Bug?

Heute Nachmittag, als wir an der Blogseite für nen Kunden gebastelt haben ist uns ne interessante CSS Eigenschaft aufgefallen. Wenn man in dem Avenue Theme eine background-color verwendet (für den body) dann wird markierter Text nichtmehr weiß mit türkisem Hintergrund sondern türkis mit weißem Hintergrund. Was die Seite individuell erkennbar machen würde, wenn man diese Farben frei wählen könnte. Vielleicht könnte man damit sogar die lesbarkeit langer Textpassagen erhöhen.
Nach einigem Rumprobieren mussten wir dann feststellen, dass es sich dabei wohl um einen CSS Bug im Firefox handelt. Das Phänomen tritt nämlich nichtmehr auf wenn man die background-color aus dem CSS entfernt und leider kann man es auch (noch) nicht mit den dafür vorgesehenen CSS3 Formatierungen auf eigene CI Farben umstellen. Mehr dazu findet ihr wohl auf einer beliebigen CSS3 Seite oder im SelfHTML Forum. Ich hatte die CSS3 Eigenschaften in einem Forum gefunden – der Code sollte etwa so aussehen:

<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
<html>
<head>
<style type=”text/css”>
.content::selection {
color: blue; background-color:red;
}

.content::-moz-selection {
color: blue; background-color:red;
}
</style>
<title></title>
</head>
<body>
<span class=”content”>Das ist der Text, der wenn man ihn im Firfox markiert anders aussieht.</span>
</body>
</html>

Diese HTML Datei liefert zwar im Firefox auf einem Windows Rechner das gewünschte Ergebnis, aber schon der Firefox auf einem Mac verhält sich anders. Jedenfalls… als Beweis, dass ich die ganze Geschichte hier nicht geträumt habe gibts noch nen kleinen Screenshot.

der markierte Text ist türkis eingefärbt, nicht der Texthintergrund, wie sonst üblich

der markierte Text ist türkis eingefärbt, nicht der Texthintergrund, wie sonst üblich

Dieser Beitrag wurde unter Netz abgelegt und mit , , verschlagwortet. Setze ein Lesezeichen auf den Permalink.

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *

*

Du kannst folgende HTML-Tags benutzen: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>