it-swarm.com.ru

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

Этот код правильный?

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

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

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

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

13
markzzz

Нет, это не действительно. Элементы 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 --
>
23
Felix Kling

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

<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/

13
Alohci

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

5
shanethehat

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

4
SLB

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

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

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

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

2
Pir Abdul

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

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