CSS ::before width

[Jörg Reinholz]

Moin!

Oder ganz anders. http://alternativ-tankstelle.de/a9.html#Schleiz

Warum beschreibst Du es nicht?

2 Grafiken.

Die erste mit alle 5 weißen Sternen als Hintergundbild in einem <span> (display: inline-Block) mit passender Weite.

Der zweite span, innerhalb des ersten bekommt als Hintergrundbild das mit 5 bunten Sternen - die Breite in Prozent - gleich passend zur Punktzahl.

<div class="bewertung">
<span class="weisse_sterne"><span class="bunte_sterne" style="width:85%">&nbsp;<span></span> Text
</div>

.bewertung span {
   display; inline-block
   width: 200px;
   height: 1em;
   background-image: url(weisse_sterne.png);
}

.bewertung span.bunte_sterne {
    background-image: url(bunte_sterne.png);
}

Jörg Reinholz