2012-04-11 14 views
0

Bitte betrachten Sie den folgenden Code als HTML in Firefox und andere Browser wie Chrom oder Safari.Word-Wrap-Fehler in Firefox, arbeitet in Safari und Chrom

[]() und andere \ W Charakter scheinen Zeilenumbruch zu verursachen vorzeitige Umhüllung erzeugen

Wie durch die folgende angegeben, word-wrap vollständig umgesetzt wird.

<style> 
    div.working {background:blue; height:400px; width:130px;} 
    div.notWorking {background:red; height:400px; width:130px;} 
    div {oveflow:hidden; word-wrap: break-word; font-family:monospace} 
</style> 

<div class="working">AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA</div> 

<div class="notWorking">[X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X][X]</div> 

Danke für Ihre Hilfe

+0

Arbeiten FF v.11.0 –

+0

in Wie oben erwähnt es in FF 11,0 fein arbeitet. Ich erinnere mich, dass Probleme mit Word-Wrap in älteren Firefox-Versionen nicht funktionierten. Aber dann wurde Word-Wrap in diesen Versionen nicht richtig implementiert. – sarcastyx

+0

Ich habe versucht, ein paar Screenshots zu posten, aber wegen meines n00b Status auf dieser Seite werde ich es nicht lassen. Ich glaube, ich habe nicht wirklich versucht, den Effekt zu erklären, den ich anstrebe. Mit der Zeichenfolge von As wird der Browser umbrochen, wenn die As die Begrenzung der div's Breite erreicht. Wo wie beim [X] der Browser nach der Klammer springt. Ich glaube, das hat etwas damit zu tun, was der Browser als ein Wort betrachtet. Dies kann leicht mit pre und
mit JS eingefügt behoben werden. Aber eine JS-freie Lösung wäre interessant. – Vickenstein

Antwort

1

Ich habe eine umfassende Liste von Sonderzeichen/Strings erstellt, um zu vermeiden, dass Sie vorzeitige Warping vermeiden möchten.

'][',')(','}{','-','><','\/' 
0

Das hat nichts mit der word-wrap Eigenschaft zu tun ist; Firefox betrachtet [X][X] als ein Wort und wird entsprechend umbrochen. Ich weiß nicht, was die Liste der Interpunktionszeichen ist, die dieses spezielle Verhalten auslöst.

+0

Das ist mir auch aufgefallen, aber ich versuche wirklich, einen Weg zu finden, um diese Sonderzeichen zu umgehen. weil es wirklich einfach ist, ein div zu hacken, um
nach Ihrem Geschmack der Verpackungslänge hinzuzufügen. Aber für ein Textfeld kann ich keine Lösungen finden. – Vickenstein

Verwandte Themen