TD中的DIV是个坏主意吗？

Question

好像我在某个地方听到/读到一个<div>内部<td>是禁止的.并不是说它不起作用,只是基于它们的显示类型它们并不真正兼容.找不到任何证据来支持我的预感,所以我可能完全错了.

Answer 1

使用divinstide a td并不比使用表格进行布局的任何其他方式更差.(有些人从不使用表格进行布局,而我恰好是其中之一.)

如果你div在a中使用a ,td则会遇到可能很难预测元素大小的情况.div的默认值是从其父级确定其宽度,表格单元格的默认值是根据其内容的大小确定其大小.

div应该如何调整大小的规则在标准中有明确定义,但是td应该如何定义大小的规则并没有很好地定义,因此不同的浏览器使用稍微不同的算法.

Answer 2

检查XHTML DTD后,我发现允许<TD>元素包含标题,列表和<DIV>元素等块元素.因此,在<TD>元素内使用<DIV>元素并不违反XHTML标准.我很确定HTML的其他现代版本具有<TD>元素的等效内容模型.

以下是相关的DTD规则:

<!ELEMENT td %Flow;>
<!-- %Flow; mixes block and inline and is used for list items etc. -->
<!ENTITY %Flow "(#PCDATA | %block; | form | %inline; | %misc;>
<!ENTITY %block "p | %heading; | div | %lists; | %blocktext; | fieldset | table">

Answer 3

不,不一定.

如果您需要在TD中放置DIV,请确保正确使用TD.如果你不关心表格数据和语义,那么你最终不会关心TD中的DIV.我不认为有问题 - 如果你必须这样做,你就没事了.

根据HTML规范

A <div>可以放置在预期流内容^1的地方,即<td>内容模型².

Answer 4

表格单元格可以合法地包含块级元素,因此它本身不是虚假的.当然,浏览器的实现使这成为一种思辨理论的立场.它可能会导致布局问题和错误.

虽然表格用于布局 - 有时仍然是 - 我想大多数浏览器都会正确呈现内容.即使是IE.

Answer 5

如果你想使用position:absolute; 在position: relative;td上你会遇到问题.FF,safari和chrome(mac,而不是PC)不会相对于td定位div(就像你期望的那样)这对于div来说也是如此,display: table-whatever;如果你想这样做你需要两个div,一个用于容器width: 100%; height: 100%;没有边框所以它填充td没有任何视觉冲击.然后是绝对的.

除此之外为什么不只是分裂细胞？