nicht angemeldet
Hallo,
Das Zeichen » wird leider trotzdem durchsichtig angezeigt. Wenn ich das mit color mache:
.duplicateNick { color: white; }
.duplicateNick:after { content: "»"; color: black; }
>
> dann funktioniert es wie erwartet, der Text wird ausgeblendet, das Zeichen » wird schwarz angezeigt. Doch leider hat der Text unterschiedliche Farben und das Zeichen soll genau in der Farbe erscheinen wie der Text nur mit 50% durchsichtigkeit.
Das ist leider das Problem, bei der Verwendung von opacity. Die Eigenschaften Vererben sich. Da ein before-/after- Pseudoelement innerhalb des umschließenden Elements liegt, hast du das Problem in diesem Fall leider auch.
D.h. Wenn du einem Element einen opacity-Wert von 0.5 gibst, werden alle darin enthaltenen Kindelemente ebenfalls mit 0.5-facher Transparenz dargestellt. Wenn du denen jetzt opacity:1 zuweist passiert gar nichts. Verwendest du aber wieder opacity:0.5, werden sie nur noch mit 25%-iger Transparent dargestellt.
Leider kannst du dagegen nicht wirklich etwas machen, außer dich beim W3C zu beschweren ;-) [1]
Du könntest die Elemente zu höchstens ineinander verschachteln und einem tiefer-gelegenen Element das opacity verpassen.
Du kannst dir das Verhalten ja mal auf [meiner Beispielseite](http://danielrichter.da.funpic.de/test/opacity.xhtml) anschauen (Achtung: im Opera 9 gibt's evtl Performance-Probleme [der Bug wurde schon gemeldet]). Dort hat jedes div den gleichen opacity-Wert. Trotzdem werden die div's immer transparenter…
[1] Obwohl der filter-alpha des IE genauso arbeitet…
mfg. Daniel
--
[Experten raten von der Verwendung des Internet Explorers ab!](http://web.oesterchat.com/internet-explorer/)
[Mein SELF-stylesheet](http://danielrichter.da.funpic.de/SELFForumsCSS.html) | [Darum Firefox!](http://www.firefox-love.de/)
[Selfcode](http://forum.de.selfhtml.org/cgi-bin/selfcode.pl): [ie:{ fl:| br:> va:| ls:# fo:| rl:( n4:# ss:{ de:> js:| ch:? mo:) zu:}](http://www.peter.in-berlin.de/projekte/selfcode/?code=ie%3A%7B+fl%3A%7C+br%3A%3E+va%3A%7C+ls%3A%23+fo%3A%7C+rl%3A%28+n4%3A%23+ss%3A%7B+de%3A%3E+js%3A%7C+ch%3A%3F+mo%3A%29+zu%3A%7D)