Aus der Serie „Dinge, die ich nie über CSS wissen wollte aber herauszufinden gezwungen war“: Neulich habe wollte ich mal verschiedene mögliche Varianten einer SVG-Datei mit transparentem Hintergrund vor verschiedenen Hintergründen darstellen. Zuerst nur schwarzer und weißer Hintergrund, aber dann habe ich mir gedacht, ich könnte ja eigentlich auch ein paar Grauwerte ausprobieren.
Ich fand es schöner, das mit den CSS-Farbnamen zu machen als mir manuell die Grauwerte herauszusuchen. Dabei habe ich zwei Dinge gelernt.
Erstens: Es gibt in CSS sowohl grey als auch gray. Eine kurze Recherche ergab: Beide sind gültig, beide referenzieren denselben RGB-Farbwert #808080 und wurden vermutlich eingeführt, damit sich Briten und Amis nicht in die Haare geraten, wie es zum Beispiel auf Wikipedia passiert ist. Es wird aber geraten, sich in einer CSS-Datei auf eine Variante zu einigen. Diese doppelte Benennung gibt es auch für andere Grautöne, wie lightgrey und darkgrey Aufgefallen ist mir das, weil ich in einer Liste die RGB-Farbwerte nachgeschaut und je nach Grauton eine unterschiedliche Schreibweise gefunden habe.
À propos lightgrey und darkgrey: Die zweite Sache, die ich gelernt habe ist, dass darkgrey heller ist als grey. Ich hatte mich schon gefragt, ob ich irgendwo falsche Klassen vergeben oder im CSS Mist gebaut habe. Aber nein. Ich wollte drei Blöcke haben, mit immer dunkler werdenden Grautönen und hatte stattdessen #D3D3D3 (lightgrey), #808080 (grey) und #A9A9A9 (darkgrey). Ich weiß nicht, wer sich, das ausgedacht hat, aber es ist sehr kontraintuitiv. Ich habe dann als dunkelsten Grauwert doch manuell einen Wert eingegeben, #444444.
So, und jetzt werde ich mich wieder den schöneren Seiten widmen. Zum Beispiel, dass man heutzutage viele frühere CSS-Hacks durch sauberere, moderne Lösungen ersetzen kann.