HTML Force引入了换行符/换行符

Question

I have a table cell with some fixed width...

Now the content/text charcter length inside this cell varies and cannot always have a space in between which causes the layout to break slightly.

I tried fixing by adding the CSS word-wrap:break-word But for some reason, this does not work always.

How do I make sure that my text breaks to the next line even if it does not have a space in between ?

Answer 1

The practical solution is to insert the tag <wbr> at any point where a direct line break is permissible, eg

<td>MaxUName<wbr>MaxUName<wbr>MaxUName<wbr>MaxUNa</td>

To get somewhat better browser coverage for the good old <wbr> (which never made its way to any standard but is alive and kicking), add the following into your style sheet:

wbr:after { content: "\00200B"; }

More info: http://www.cs.tut.fi/~jkorpela/html/nobr.html#wbr

Answer 2

I edited your jsfiddle so that it can work :

EDIT http://jsfiddle.net/Dnzra/2/

All you have to do, is to add : style="table-layout: fixed" to the table style and some fixed width to your cells.