Как сломать длинное одиночное слово в <td> с помощью CSS?

в a td of table я имеет очень длинное одно слово " Pneumonoultramicroscopicsilicovolcanoconiosis", и я хочу уменьшить ширину table, но не могу сделать из-за этого длинного слова в одном из td я могу сломать это слово, предоставив <br />, но есть ли какой-либо способ CSS сломать это слово в соответствии с доступным пространством. без предоставления разрыва строки или редактировать что-либо в HTML.

Ответ 1

Попробуйте следующее:

word-wrap: break-word;
white-space: normal;

word-wrap - css3 (однако он работает в IE). Возможно, вы не сможете заставить его работать в старых браузерах.

Ответ 2

Для меня работает следующее:

    word-wrap: break-word;
    word-break: break-all;
    white-space: normal;

Ответ 3

td span{display:block;width:your_max_width_here.px}

<td><span>Pneumonoultramicroscopicsilicovolcanoconiosis</span></td>

Ответ 4

Попробуйте использовать следующий код для слова break, если нет места.

word-wrap: break-word;
word-break: break-all;

Ответ 5

попробуйте мой код -

С телом

table>tbody>tr>th{
    word-wrap: break-word;
    word-break: break-all;
    white-space: normal;
}

Без тела таблицы

table>tr>th{
    word-wrap: break-word;
    word-break: break-all;
    white-space: normal;
}

Ответ 6

Я пробовал разные комбинации решений, найденных здесь и на других страницах, но он никогда не работал так, как ожидалось для меня - короткие слова были разделены, даже если у них было место на строке ниже, и это выглядело тупой.

Наконец, я нашел этот компромисс:

table {
    table-layout: fixed;
    overflow-wrap: break-word;
    word-wrap: break-word; /* IE */
}

Если вы хотите одинаково обрабатывать свои строки, он лучше всего работает.

Ответ 7

Следующий код должен работать;

td {word-break: break-all}

Ответ 8

Я обнаружил, что когда у вас есть смесь содержимого в ячейке, некоторые длинные отдельные слова смешиваются с другими короткими словами, что word-break: break-word; работает лучше всего. Когда это возможно, он будет разбит на пробелы. Хотя это, похоже, не поддерживается в IE11. Если вы установите break-all для любого из указанных свойств, он всегда будет разбит на одно слово (если только ему не повезло быть на пробеле).