Sehr lange Wörter, die nicht in HTML/CSS eingebettet sind

Question

Ich habe ein Problem, wo ein Benutzer einen langen Kommentar/ein langes Wort wie "cooooooooooooooooooooooooooooooooooool" eingeben würde, würde dies die Formatierung auf der Seite brechen. Hier

ist ein Bild unten, um das Szenario zu erklären (nicht maßstäblich) und auch den Code verwendet:

Html:

<div class="comment-content"> 
    <p>cooooooooooooooooooooooooooooooooooooooool</p> 
    <br /> 
    <a class="delete-comment" data-delete-comment-id="28" href="/">Delete</a> 
</div> 

Css:

.comment-content 
{ 
    width: 525px; 
    margin: 13px 25px 0 0; 
} 
.comment-content p 
{ 
    width: 525px; 
} 

Ich frage mich, ob es eine schnelle Lösung dafür gibt, ohne zu viel Markup und CSS zu ändern, da dies Codebereich ist, den wir keine Fehler einführen möchten, indem Sie den Anwendungscode (in ASP.NET/MVC 3 geschrieben) ändern.

Wenn CSS/Html keine Option war Ich denke, die HTML 5 <wbr> Tag könnte verwendet werden, um das Wort nach "x" Anzahl der Zeichen zu trennen - das einzige Problem damit ist, dass die Website mehrsprachig in 9 Sprachen ist. Japanisch und Chinesisch zum Beispiel die Textzeichen sind wesentlich größer als englische Textzeichen, die mehrere bedingte Code für diese benötigen, um die Anzahl der Zeichen vor dem Hinzufügen der <wbr> erhalten oder die Schriftgröße verringert. Nur nach den Vorschlägen für die beste Lösung wirklich.

Vielen Dank

Answer 1

Versuchen Sie, diese

.comment-content p { 
    word-wrap: break-word; 
} 

Live Demo

More Information

Answer 2

Dies kann helfen:

.class { 
    resize:none; 
} 

Answer 3

Wenn Sie es möchten schön wie gekappt werden: oooooo ... Verwendung:

.comment-content .p{ 
    display:inline-block; 
    white-space: nowrap; 
    overflow:hidden; 
    text-overflow: ellipsis; 
} 

Wenn es mehr als eine Zeile sind, verwenden