Почему мой td не сотрясает его содержимое

Question

У меня есть ячейка таблицы, которая продолжает сопротивляться, чтобы обернуть ее содержимым (span). Здесь escenario согласно Chrome Дев инструментов:

<td> имеет следующие правила:

overflow:visible; 
white-space:normal; 

<table> имеет:

table-layout:fixed; 

Первая строка в таблице имеет две колонки с фиксированной шириной определены; Проблемная ячейка имеет padding="2".

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

word-break: break-all; 
word-wrap: break-word; 
max-width: 120px; /*this is the max width I want to ensure*/ 

Что мне здесь не хватает?

Answer 1

Я не знаю точно, как ваш код, потому что вы его не публиковали, но я следовал вашим инструкциям, и это сработало для меня.

Посмотри здесь: http://jsfiddle.net/FJ7dB/

HTML:

<table> 
    <tr> 
     <td>TD-1-1</td> 
     <td padding="2"> 
      <span>TD-1-2 ContentContentContentContentContentContentContentContentContentContentContentContentContentContentContentContentContent</span> 
     </td> 
    </tr> 
    <tr> 
     <td>TD-2-1</td> 
     <td>TD-2-2</td> 
    </tr> 
</table> 

CSS:

table{ 
    table-layout:fixed; 
    border:1px solid blue; 
} 
td{ 
    width:120px; 
    max-width:120px; 
    word-break: break-all; 
    word-wrap: break-word; 
    border:1px solid red; 
} 

Что делает его работа max-width, что вы сказали, что не удалось.

И не нужно устанавливать

overflow:visible; 
white-space:normal; 

потому visible и normal являются их значения по умолчанию.