CSS ::before width

[Jörg Reinholz]

Moin!

Nicht ganz: Durchsichtige Sterne und dazu eine Hintergrundfarbe.

Wenn man den farbigen Hintergrund als linear-gradient macht, braucht man kein zusätzliches Element.

Auch eine klasse-Idee. Hat aber nichts mit der mit Dir verlinkten Tankstellenseite zu tun, denn da sind die spans verschachtelt:

<span class="sterne"><span style="width: 90%">&nbsp;</span></span>

	#content .sterne
	{
		display: block;
		float: left;
		margin-right: .5em;
		padding: 0;
	        width: 130px; 
		height: 24px; 
		background-image: url(stern.gif);
	        background-repeat: no-repeat; 
		background-position: 0 -120px;
		overflow: hidden;
	}
	#content .sterne span
	{ 
		display: block;
		background-image: url(stern.gif);
		background-repeat: no-repeat; 
	        background-position: 0 0;
		height: 24px;
	}

Im Hinblick auf Gif und das zugehördende CSS (background-position: 0 -120px;) wird mir aber klar, dass keine beiden Klasse-Methoden verwendet, sondern einfach eine Zeile aus dem Pic "ausgewählt" wird. Wieso dann da nochmal ein gif "drübergezimmert" wird erschließt sich noch nicht ganz, ich habe in der kurzen Zeit keine weitere (ganz anders) bewertete Tankstelle gefunden. Es sieht sogar so aus, als würden zwei Arten des Vorgehens kombiniert.

(Update: jetzt doch: Es werden nur die vollständig blauen und vollständig weißen Sterne (1. und letzte Zeile) benutzt und die Überdeckung (Breite des 2. Spans) bestimmt, wie viele Sterne angezeigt werden.)

Hehe. Wieso muss ich Dir eigentlich sagern, wie Deine Seite funktioniert?

Hinweis: Der 404er verweist auf die falsche Domain.

Jörg Reinholz