Ausrichten von Text am Leerzeichen

**darkness** · 01.10.2020, 12:23

Hallo Zusammen,

auf einer Internetseite habe ich folgenden Text für eine Statistik:

Code:

16 Brandeinsätze
2 Gefahrstoffeinsätze
11 Hilfeleistungseinsätze
2 Sicherungsdienste
0 Wasserrettungseinsätze

Diesen würde ich jetzt gerne so ausrichten, dass die Leerzeich untereinander sind:

Code:

16 Brandeinsätze
 2 Gefahrstoffeinsätze
11 Hilfeleistungseinsätze
 2 Sicherungsdienste
 0 Wasserrettungseinsätze

Ich habe jetzt einfach vor jeder einstellgen Zahl ein Leerzeichen eingefügt (könnte ich dann auch so im ModulCode umsetzen). Aber geht das nicht auch "eleganter" mittels CSS?

**dazzle89** · 01.10.2020, 12:38

Handelt es sich um eine Liste? Also <ul>? Tabelle? Einfacher Absatz?

Auf jeden Fall könntest du die Zahlen in ein <span> packen und diesem gibst du folgendes CSS:

Code:

float: left;
width: 40px;

Die 40px kannst du natürlich beliebig anpassen.

**darkness** · 01.10.2020, 12:45

Danke,

ja eine ul ist es

Code:

<ul>
        <li>16 Brandeins&auml;tze</li>
        <li>2 Gefahrstoffeins&auml;tze</li>
        <li>11 Hilfeleistungseins&auml;tze</li>
        <li>2 Sicherungsdienste</li>
        <li>0 Wasserrettungseins&auml;tze</li>
</ul>

Edit:

Die Zahlen sollen auch ausgerichtet sein. Also die 2 unter der 6 usw.

**dazzle89** · 01.10.2020, 12:52

Dann zusätzlich noch ein text-align: right; einfügen und ein margin-right: 10px; (bzw. Wert deiner Wahl)

**Stefko** · 01.10.2020, 12:57

Wo kommen die Daten denn her, von Hand eingegeben min TinyMCE?
Dann würde ich da eine Tabelle verwenden und der Spalte mit der Anzahl ein text-align: right; geben.

**darkness** · 01.10.2020, 13:02

Danke, teste ich mal

Die Daten werden dynamisch aus einem Modul erzeugt und aufgelistet. Bisher halt eben nur als ul.

Edit

Sauber. Läuft und sieht gut aus! Danke