<div> в <tr>: это правильно?

Правильно ли этот код?

<table>
    <tr>
        <td>...</td>
    </tr>

    <tr>
        <div>...</div>
    </tr>

    <tr>
        <td>...</td>
    </tr>    
</table>

не знают для семантических (и правил W3C). Что вы можете сказать?

Ответ 1

Нет, это неверно. Элементы tr могут содержать только элементы th и td. Из спецификация HTML4:

<!ELEMENT TR       - O (TH|TD)+        -- table row -->
<!ATTLIST TR                           -- table row --
  %attrs;                              -- %coreattrs, %i18n, %events --
  %cellhalign;                         -- horizontal alignment in cells --
  %cellvalign;                         -- vertical alignment in cells --
>

Ответ 2

Не только это недействительно, но это не сработает! Эта надбавка

<table>
    <tr>
        <td>The First Row</td>
    </tr>

    <tr>
        <div>The Second Row</div>
    </tr>

    <tr>
        <td>The Third Row</td>
    </tr>    
</table>

Производит отображение

The Second Row
The First Row
The Third Row

Div полностью выталкивается из таблицы и помещается перед ним в DOM

см. http://jsfiddle.net/ELzs3/1/

Ответ 3

Нет, вы не должны использовать div внутри таблицы, потому что это элемент уровня блока. Вы можете переопределить поведение с помощью CSS, но оно не будет проверяться с помощью W3C, если это ваша цель.

Ответ 4

Нет, вы не должны использовать <div> внутри <tr>. Вы можете использовать его внутри <td>, где, поскольку таблица является правильно вложенной таблицей, хотя это может быть не самая лучшая практика. Вы действительно можете переопределить настройку отображения div или любого элемента. Фактически вы могли бы отобразить <div> (который по умолчанию для блока) в виде таблицы-таблицы и наоборот.

Ответ 5

Это будет работать в режиме quirks, но браузер, который совместим со стандартным режимом, не будет работать в зависимости от вашего doctype. Избегание режима quirks является одним из ключей к успешному созданию веб-контента, совместимого с несколькими браузерами.

Некоторые современные браузеры имеют два режима рендеринга. Режим Quirk предоставляет HTML-документ, такой как старые браузеры, используемые для этого, например. Netscape 4, Internet Explorer 4 и 5. Стандартный режим отображает страницу в соответствии с рекомендациями W3C. В зависимости от декларации типа документа, присутствующей в документе HTML, браузер переключается либо в режим quirk, либо в стандартный режим. Если нет объявления типа документа, браузер переключится в режим quirk.

http://www.w3.org/TR/REC-html32#dtd

JavaScript не должен вести себя по-другому; однако объекты DOM, на которых работает JavaScript, могут иметь разные типы поведения.

Ответ 6

Скажем, ваша строка таблицы содержит 5 столбцов в целом, и вы хотите, чтобы ваш div занимал всю ширину таблицы. Следующее должно сделать трюк.

<tr>
  <td colspan=5>
    <div class="some-class">
      <p>Hey</p>
    </div>
  </td>
</tr>