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

Question

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

Answer 1

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

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

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

Answer 2

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

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

Answer 3

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

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

Answer 4

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

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

Answer 5

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

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

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

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

Answer 6

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

С телом стола

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;
}

Answer 7

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

td {word-break: break-all}

Answer 8

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