Zeilenumbruch an der falschen Stelle

[Rolf B]

Update: War natürlich Unsinn <x-t></x-t> zu verwenden. Wenn man schon ein Element für Takte definiert, dann sollte man auch den Takt komplett hineinsetzen. Sieht besser aus und die Lesbarkeit ist besser.

Man könnte versucht sein, das chord-Attribut auf das x-t Element zu legen. Das bewirkt dann aber, dass man Akkordwechsel nur zum Taktbeginn machen kann (oder doch x-a braucht, um während des Takts den Akkord zu wechseln).

So sähe es aus - ich habe „Glück“ mit dem ?-Akkord markiert, um zu zeigen, dass man auch x-a verwenden kann 😉

<x-l>
  <x-t chord="C">Einmal</x-t>
  <x-t chord="G7">um die ganze</x-t> 
  <x-t>Welt, und die</x-t>
  <x-t chord="C">Taschen voller</x-t> </x-l>
<x-l>
  <x-t>Geld, dass man</x-t>
  <x-t chord="G7">keine Liebe</x-t>
  <x-t>und kein <x-a chord="?">Glück</x-a> ver-</x-t></x-l>
<x-l>
  <x-t><x-a chord="C">säumt.</x-a></x-t></x-l>
<x-l>
  <x-t>𝄽 𝄽 Viele</x-t>
  <x-t chord="G7">fremde Länder</x-t> 
  <x-t>seh’n, auf dem</x-t></x-l>
<x-l>
  <x-t chord="C">Mond spazieren</x-t>
  <x-t>geh’n, davon</x-t> </x-l>
<x-l>
  <x-t chord="G7">hab’ ich schon als</x-t>
  <x-t>kleiner Bub ge-</x-t></x-l>
<x-l>
  <x-t chord="C">träumt.</x-t>
  𝄽 𝄽 𝄽 𝄽 </x-l> 

x-l {
  display: block;
  margin: 0.7em;
  font-style: italic;
  font-weight: bold;
  color: blue;
}
x-l x-t {
  display: inline;
  position: relative;
}
x-l x-t::after {
  content: ' |';
  color: gray;
  font: bold 100% sans-serif;
}
x-a {
  position: relative;
}
x-t[chord]::before,
x-a[chord]::before {
  content: attr(chord);
  position: absolute;
  color: red;
  font: italic bold 100% sans-serif;
  display: inline-block;
  top: -0.7em;
  left: -0.5em;
  width:0;
}

Rolf