• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

[ERLEDIGT] Texteinrückung nach Sprecher, auch in Folgezeilen

paufel

Neues Mitglied
Hallo,

ich versuche eine Text für eine Online-Umfrage zu formatieren, aber sier sieht immer so aus, obwohl ich gerne hätte, dass der Sprechtext eingerückt ist, auch über Zeilenumbrüche hinweg.:

Sprecher1: blablablabla
blablablabla
Sprecher2: blablablabalba
....
.....

____
Der Sprecher soll aber in der gleichen Zeile stehen wie der Text, was noch klappt, und der Text soll eingerückt sein und vor allem auch in der/den Folgezeilen (was nicht klappt). Und die Zeilenumbrüche sollen an die Breite des Browserfensters angepasst sein, daher bin ich mit pre und br etc nicht weitergekommen. Es wäre super, wenn jemand was weiß!! PS:Bin Anfänger
 
Werbung:
Hi, danke für die schnelle Antwort. Habe mal damit rumprobiert. Mit der <li> Funktion wird zwar die Folgezeile eingerückt, aber auch nicht weiter als das Label/der Sprecher, was das eigentlich wichtige wäre.
Mit den restlichen Sachen im Link, komme ich auch nicht spontan weiter, da die css Sachen in dem Dokument nicht funktionieren, bzw. ich als Anfänger nicht weiß, was ich machen muss, damit css funktioniert. Gibt es nicht irgendeine simple html Lösung, die sowas macht, (s. Beispiel), nur dass der Sprecher in der gleichen Zeile steht, wie das Gesprochene?

Beisiel:
<blockquote>
<div style="text-indent: -18px;">Sprecher</div>
<p>TextTextTextTextTextTextTextTextTextTextTextTextTextTextTextText
TextTextTextTextTextTextTextTextTextTextTextTextTextText </p>
</blockquote>
 
Wenn ich das Beispiel von der Seite, die @Sempervivum empfohlen hat, einfach mal abtippe und nach deinen Vorgaben etwas anpasse, kommt folgendes raus...
HTML:
<!DOCTYPE html>
<html lang="de">
<head>
<title>Einrücken</title>
<style>
  .eingerueckt {
     padding: 0; margin: 0;
  }
  .eingerueckt li {
     padding-left: 85px; text-indent: -85px; /*Die Zahlenwerte müssen gleich sein - bestimmen wie weit eingerückt wird*/
  }
  .eingerueckt li > * {
     text-indent: 0;
  }
</style>
</head>
<body>
    <ul class="eingerueckt">
      <li>
        <strong>Sprecher 1:</strong>
        Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text
      </li>
      <li>
        <strong>Sprecher 2:</strong>
        Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text
      </li>
      <li>
        <strong>Sprecher 3:</strong>
        Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text Text Text Text Text Text Text Text TextText Text Text Text Text Text Text Text
      </li>
    </ul>
</body>
</html>
Und das sollte genau das sein, was du in deinem Eingangsbeitrag beschrieben hast.
 
Werbung:
Geil danke, es geht! Vielen, vielen Dank!!
Also vielen Dank, dass ihr beide euch die Zeit genommen habt! Super nett :) :)!
Liebe Grüße
Paul
 
Zurück
Oben