Text mit Punkten in CSS

Frage: Wie kann ich Text nach rechts mit einem einheitlichen Punktabstand mit einfachem CSS ausrichten, wie es gesehen wird In diesem Beispiel?

Drug 1 ............  10ml
Another drug ......  50ml
Third ............. 100ml

Antwort: Um diese Rechtfertigung zu erreichen, wird eine Technik unter Verwendung des: Nach Pseudo-Element häufig verwendet:

css:

dl { width: 400px }
dt { float: left; width: 300px; overflow: hidden; white-space: nowrap }
dd { float: left; width: 100px; overflow: hidden }

dt:after { content: " .................................................................................." }

Html:

Drug 1

10ml

Another drug

50ml

Third

100ml

Einschränkungen:

• dh Versionen unter 8 werden nicht unterstützt. von Sonderfiguren wie & Middot;. UTF-8-Zeichen können jedoch die meisten Bedürfnisse erfüllen.