Webseitebegutachtung

[Gunnar Bittersmann]

@@Rolf B

<x-l> ist ein Vorschlag, den Gunnar mal gemacht hat. […] Mit display:block sorgst Du für den Zeilenumbruch

Ich nutze das nicht mehr so. Wenn CSS nicht greift, fehlt die Trennung (nicht nur die visuelle als Zeilenumbruch) völlig. @Felix Riesterer hatte das wiederholt angemecket und ich konnte ihn nicht mal unrechtgeben.

Ich verwende jetzt

<p>
  <x-l>Freude, schöner Götterfunken,</x-l><br/>
  <x-l>Tochter aus Elysium,</x-l><br/>
  <x-l>Wir betreten feuertrunken,</x-l><br/>
  <x-l>Himmlische, dein Heiligtum</x-l>
</p>

(Beispiel)

Zeilenumbrüche mit dem dafür vorgesehenen HTML-Element br; x-l bleibt inline und ist nur noch für die Einzüge zuständig:

mit padding:0 0 0 2em sorgst Du für eine Einrückung jeder Zeile um 2em, und mit text-indent: -2em rückst Du die erste Zeile wieder 2em zurück.

Dein Code ist WET (write everything twice), man möchte das Gegenteil: DRY (don’t repeat yourself), also sowas:

x-l {
  --hanging-indent: 2em;
  padding-left: var(--hanging-indent);
  text-indent: calc(-1 * var(--hanging-indent));
}

Es wäre schöner, wenn text-indent:2em hanging schon funktionierte

Und vor allem auch text-indent: 2em hanging each-line. [MDN] Dann bräuchte man die x-l-Elemente gar nicht mehr.

aber das ist zu neu.

Wenn ich mir das so ansehe, würde ich eher sagen: die Browserhersteller haben überhaupt keine Lust, das zu implementieren.

😷 LLAP