Стиль HTML не работает в FF в представлении MVC

Question

У меня есть следующий вид:

<div style="width:600">
    <fieldset style="width:600">
    <table style="width:600" >
       <tr>
             <td>TEST</td>
             <td ><span class="displayData"><%= Html.Encode(Model.MyDESCRIPTION)%></span></td>  
             <td style="width:100%;" >&nbsp;</td>                  
             <td style="white-space: nowrap;">....</td>
             </tr>
        </table>
    </fieldset>
</div>

Я хочу ограничить ширину в 600 пикселей для печати, поэтому я установил верхний предел div на width=600, который отлично работает в IE, но не работает в Firefox.

Например, если данные для MyDESCRIPTION выглядят примерно так:

12222222222222332222222132213123..123131111111111111111111111111111 
(no space, its total length will exceed 600).

В IE строка может быть деформирована в несколько строк в пределах 600 ограничений. Но в Firefox линия будет расширена и деформации не будет, поэтому она будет обрезана дисплеем. Но печать подходит для FF.

Я очень смущен. Как я могу решить эту проблему?

Answer 1

Вам нужен следующий CSS, чтобы разорвать строку:

td span {
    width: 600px;
    white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
}