HTML-Tabelle: Automatischer Zeilenumbruch in langen Worten

Da hat man nun eine „responsive Website“ mit responsive Tabellen – aber: ein langes Wort bzw. ein langer zusammenhängender String lässt die HTML-Tabelle über den Seitenrand hinausragen (siehe Abb.)

Screenshot einer Tabelle, die über den Seitenrand hinausragt

Wer bei langen Strings den Zeilenumbruch nicht mit „harten“ Breaks oder Leerzeichen erzwingen mag, kann in den HTML-Code folgenden „td style“ einbauen:

<td style="word-break:break-all;word-wrap:break-word"></td>

Beispiel:

<table>
<tbody>
<tr>
<td style="word-break: break-all; word-wrap: break-word;">
IchBinZwarEinSuperUltraLangesWortAberMitDiesemStyleWerdeIchGanzGeschmeidig
</td>
</tr>
</tbody>
</table>

3 Kommentare

  1. Vielen Dank, ein super Tipp, der mir bei der Webseite für meine neue Unternehmung sehr geholfen hat. Konkret habe ich das Problem gehabt, dass „zu lange“ Wochentag im Kalender das korrekte Skalieren der Tabelle unterbunden haben.
    Mit dieser Maßnahme funktioniert jetzt alles gut.

  2. Hallo Eva,

    hat mir auch sehr geholfen.
    Funktioniert auch bei dynamisch generierten PDF.
    🙂

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.


CAPTCHA

*