Использование «word-wrap: break-word» в таблице

Возможный дубликат:
Word-wrap в таблице html

Этот текст ведет себя точно так, как я хочу, в Google Chrome (и других современных браузерах):

 
  1. Когда браузер достаточно широкий, a + и b + находятся на одной строке.

     aaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb 
  2. По мере того как вы сужаете браузер, a + и b + помещаются в отдельные строки.

     aaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb 
  3. Когда b + больше не подходит, он разбивается и помещается на две строки (всего три строки).

     aaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbb bbbbbbbb 

Это здорово.

В моей ситуации, однако, это не div а table , например:

 

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb

В этом случае # 1 и # 2 происходят, но не # 3. То есть, таблица перестает сужаться после шага 2, а шаг 3 никогда не произойдет. Брейк-слот, похоже, не фильтруется.

Кто-нибудь знает, как сделать №3? Решение должно работать только в Chrome, но оно также работало в других браузерах, что было бы еще лучше.

PS «Не использовать таблицы» не помогает.

table-layout: fixed будет заставлять ячейки соответствовать таблице (а не наоборот), например:

 
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb

Вы можете попробовать следующее:

td p {word-break:break-all;}

Это, однако, заставляет это выглядеть так, когда есть достаточно места, если вы не добавите тег:

 aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb 

Итак, я бы предложил добавить tags, где есть новые строки, если это возможно.

 aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb 

http://jsfiddle.net/LLyH3/3/

Кроме того, если это не решит вашу проблему, здесь есть аналогичный stream.

  • Как использовать функцию slideDown (или показать) в строке таблицы?
  • cols, colgroups и css: hover psuedoclass
  • Давайте будем гением компьютера.