Witam,
Kod: http://jsfiddle.net/HZXFS/2/ (dla nieklikatych na końcu)

Proszę najechać kursorem na dowolny czarny kwadrat - tylko Firefox robi
ładne transition dla opacity na :before, Opera i GChrome działają jakby
transition nie było.
Na http://caniuse.com/ wszystkie się chwalą pełnym wsparciem dla
transition, opacity i generated content.
Znacie na to fix jakiś, czy trzeba poczekać aż zaimplementują? :/


Obiecany kod dla nieklikatych:
HTML:
<div class="wrapper">
<div class="normal">normal</div>
<div class="pseudo"></div>
</div>

CSS:
.pseudo:before,
.normal {
width:100px;
height:100px;
background-color:#000;
color:#fff;
opacity:0.5;
-webkit-transition:opacity 1s linear;
-moz-transition:opacity 1s linear;
-ms-transition:opacity 1s linear;
-o-transition:opacity 1s linear;
transition:opacity 1s linear;
}

.wrapper:hover .normal,
.wrapper:hover .pseudo:before {
opacity:1;
}

.pseudo:before {
content:"pseudo";
display:block;
}


--
message[autor="PablO"]::after {
content:"Pozdrawiam";
}