Headline mit gepunkteter Linie (.png) -> fehlerhafte CSS?

Hallo,

ich möchte gerne dieses Styling einer Headline mit gepunkteter Linie, die rechts neben dem Text anschließt. Die Linie ist aus einem .png erstellt:



Diesen Code hab ich in einer Seite:

HTML:

Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!

und das sind die dazugehörigen CSS:

Code:

Entschuldige, aber du musst dich registrieren oder anmelden um den Inhalt sehen zu können!

Ergebnis:



Live:
http://playground.viaina.de/testpage/

Irgendwas muss jedoch mit meinem ":before" Code falsch sein ... was kann ich tun, damit die gepunktete Linie nicht hinter den jeweiligen Text geht, sondern rechts davon anschließt?

Danke.