jquery dataTable kann Text nicht brechen, wenn es sich um eine URL handelt

Question

Ich arbeite mit einer Passwortwächter-Website. Im Projekt wird eine jquery dataTable angezeigt, die Website, Benutzername, Passwort und Notiz enthält. Die Website-Spalte wird jedoch die URL als eine Zeile angezeigt, dass die Spaltenbreite zu groß ist, wenn die URL zu lang ist.

Aber die lustige Sache ist die Notiz Spalte der Tabelle wird Text zu brechen, wenn zu lange.

zum Beispiel:

URL(will not break): http://www.text.com/aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa/too_long_cannot_show/bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb 

Username:Username 
Password:Password 
Note(will break which depend on window's width): I am note.I am note.I am note.I am note.I am note.I am note.I am note.I am note.*100 

Ich habe versucht:

create a div to contain the table, then set its max-width:1000px ==> fail 
override the dataTable class, set its max-width:1000px ==> fail 

irgendeine Idee?

Answer 1

Es hat nichts mit DataTables zu tun. Ihr Notizentext enthält Leerstellen, während die URL keine davon enthält (reine HTML/CSS-Dinge).

Verwenden word-break: break-all; für Orte, an denen Zeilenumbruch Wörter Bedeutungen nicht (wie URL) brechen

.auto-break { 
 
    word-break: break-all; 
 
}

<table> 
 
    <tr> 
 
    <td class="auto-break">http://www.text.com/aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa/too_long_cannot_show/bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb</td> 
 
    </tr> 
 
</table>