Fixed table-layout td words not wrapping

Question

У меня есть таблица, заполняемая разной длиной текста. Я установил свойство table-layout css для исправления, потому что он продолжает толкать таблицу за пределами родителя, создавая горизонтальную полосу прокрутки.

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

Я хочу, чтобы текст, чтобы обернуть вокруг 20, так что не перекрывает другой текст. Я не могу использовать <br />.

Проблема с jsFiddle.

Редактировать: Nick Beranek Ответил на этот вопрос, но я ищу причину этого. Когда <p> теги не в таблице, как это, слова обертывают по умолчанию без добавления CSS. Может ли кто-нибудь объяснить мне, почему это не работает в этой ситуации?

Answer 1

Вы можете использовать word-wrap: break-word на p. Он работал в вашем jsFiddle, и он совместим с IE, поскольку Microsoft разработала его.

Answer 2

как вы устанавливаете ширину контейнера меньше, попробуйте увеличить ширину контейнера, Check JSFiddle for demo, ширина 250 будет разрываться до точной позиции 20.

Answer 3

Причина, по которой она не нарушена, состоит в том, что в строке нет пробелов. Как только вы добавите пробел в набор чисел, он сломается. Поэтому одним из способов исправить это было бы назначение word-wrap:break-work в селектор p.