• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

Zeilenumbruch erzwingen

Velo

New member
Hallo zusammen,

hab mich grad eben hier angemeldet, weil ich einfach nimmer weiterkomm bei meinerm Problem. (Sorry, falls es das Thema schon irgendwo gibt)

Also folgendes:
Ich hab einen <div>-Tag mit width:695px ... Allerdings hält sich der Text nicht an diese Grenze. Der Inhalt geht über den Rand hinaus und hört es bei dem nächsten <br> auf. Der Inhalt wird durch einen WYSIWYG-Editor erzeugt. Der erzeugte HTML-Code ist blöderweise mit zahlreichen Span-Tags verseucht. Nun will ich aber nicht auf den WYSIWYG-Editor verzichten, schließlich ist das für einen Kunden und dem kann ich nicht zumuten, seine <br>-Tags selber per Hand zu setzen.
Ich hab schon überlegt eine Funktion einzusetzen, die die Zeichen vom String zählt und nach einer bestimmten Anzahl bei einem Leerzeichen automatisch ein <br> setzt, allerdings wär das nicht ganz sauber, da ja auch die HTML-Tags miteinbezogen werden und das die tatsächliche Länge vom Text verfälscht.

Hat da jemand von euch eine Idee was man da machen könnte? Über CSS hab ich glaub ich schon jede erdenkliche Möglichkeit ausprobiert, aber ohne Erfolg. :(

Danke schonmal für die Hilfe
 
Klingt komisch, ist aber so...
Fakt ist einfach, der Text geht über den Rand hinaus. Er hält sich nicht an die width-Angabe im css und auch nicht an andere css elemente die den Textumbruch erzeugen könnten.
Das muss irgendwas mit dem erzeugten HTML-Code vom wysiwyg-editor zu tun hab. Wenn ich in dem <div>-Tag einfach mal hadcoded einen langen Text reinpack, dann macht er den Zeilenumbruch auch da, wo er ihn machen soll, nämlich ab width:695px. Beim erzeugten vom wysiwyg-editor aber eben nicht..
 
Es ist weder in meiner CSS noch im erzeugten HTML-Code die Eigenschaft white-space:nowrap; vorhanden...

Hier mal ein kleiner Auszug aus dem erzeugten wysiwyg code
<pre>
<p class="MsoNormal" style="margin: 0cm 0cm 0pt;">
<b style="">
<span style="font-size: 10pt;" lang="NL">
<font face="Arial">
<font color="#666666">
<font size="3">
360° competentie in werkplaatsoplossingen.
<o:p>
</o:p>
</font>
</font>
</font>
</span>
</b>
</p>
<p class="MsoNormal" style="margin: 0cm 0cm 0pt;">
<span style="font-size: 10pt;" lang="NL">
<font face="Arial">
<font color="#666666">
<font size="3">
Voor autofabrikanten, -handelaren en werkplaatsen.
<o:p>
</o:p>
</font>
</font>
</font>
</span>
</p>
<p class="MsoNormal" style="margin: 0cm 0cm 0pt;">
<span style="font-size: 10pt;" lang="NL">
<font face="Arial">
<font color="#666666">
 
</font>
</font>
</span>
<b style="">
<span style="font-size: 10pt;" lang="NL">
<font face="Arial">
<font color="#666666">
 
<o:p>
</o:p>
</font>
</font>
</span>
</b>
</p>
<p class="MsoNormal" style="margin: 0cm 0cm 0pt;">
<font face="Arial">
<font color="#666666">
<b style="">
<span style="font-size: 10pt;" lang="NL">
U bent autofabrikant?
</span>
</b>
<span style="font-size: 10pt; color: lime;" lang="NL">
<o:p>
</o:p>
</span>
</font>
</font>
</p>
<p class="MsoNormal" style="margin: 0cm 0cm 0pt;">
<font face="Arial">
<font color="#666666">
<span style="font-size: 10pt;" lang="NL">
… en u wilt voor de werkplaatsen die door u gecertificeerd zijn, uw voertuigspecifieke
<u>OEM-uitrustingsprogramma</u>
</span>
<span style="font-size: 10pt; color: lime;" lang="NL">
[
</span>
<span style="font-size: 10pt; color: lime; font-family: Wingdings;" lang="NL">
<span style="">
ß
</span>
</span>
<span style="font-size: 10pt; color: lime;" lang="NL">
Link Leistungen – OEM-Equipment-Programme]
</span>
<span style="font-size: 10pt;" lang="NL">
ontwikkelen
</span>
<span style="font-size: 10pt;" lang="NL">
? Of omvangrijke
<u>speciale projecten onderbrengen </u>
</span>
<span style="font-size: 10pt; color: lime;" lang="NL">
[
</span>
<span style="font-size: 10pt; color: lime; font-family: Wingdings;" lang="NL">
<span style="">
ß
</span>
</span>
 
Zurück
Oben