div inside table

2019-01-06 21:40发布

站内问答 / 后端开发
482 5 6

Can somebody tell me whether div inside a table is allowed or not according to w3c

5条回答
\"骚年 ilove
2楼-- · 2019-01-06 22:27

While you can, as others have noted here, put a DIV inside a TD (not as a direct child of TABLE), I strongly advise against using a DIV as a child of a TD. Unless, of course, you're a fan of headaches.

There is little to be gained and a whole lot to be lost, as there are many cross-browser discrepancies regarding how widths, margins, borders, etc., are handled when you combine the two. I can't tell you how many times I've had to clean up that kind of markup for clients because they were having trouble getting their HTML to display correctly in this or that browser.

Then again, if you're not fussy about how things look, disregard this advice.

查看更多
0人赞 添加讨论(0) 举报
▲ chillily
3楼-- · 2019-01-06 22:29

you can put div tags inside a td tag, but not directly inside a table or tr tag. examples:

this works:

<table>
  <tr>
    <td> 
      <div>This will work.</div> 
    </td>
  </tr>
<table>

this does not work:

<table>
  <tr>
    <div> this does not work. </div> 
  </tr>
</table>

nor does this work:

<table>
  <div> this does not work. </div>
</table>

查看更多
0人赞 添加讨论(0) 举报
\"骚年 ilove
4楼-- · 2019-01-06 22:30 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
  <head>
    <title>test</title>
  </head>
  <body>
    <table>
      <tr>
        <td>
          <div>content</div>
        </td>
      </tr>
    </table>
  </body>
</html>

This document was successfully checked as XHTML 1.0 Transitional!

查看更多
0人赞 添加讨论(0) 举报
Melony?
5楼-- · 2019-01-06 22:36

It is allow as TD can contain inline- AND block-elements.

Here you can find it in the reference: http://xhtml.com/en/xhtml/reference/td/#td-contains

查看更多
0人赞 添加讨论(0) 举报
爱情/是我丢掉的垃圾
6楼-- · 2019-01-06 22:44

You can't put a div directly inside a table, like this:

<!-- INVALID -->
<table>
  <div>
    Hello World
  </div>
</table>

Putting a div inside a td or th element is fine, however:

<!-- VALID -->
<table>
  <tr>
    <td>
      <div>
        Hello World
      </div>
    </td>
  </tr>
</table>
查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(6)