Django和HTML-在<td>元素中放置一个div会使它出现在错误的位置

div 根据w3c,不是表内的有效html元素。

然后,浏览器会尝试通过删除不允许的元素来修复表格布局。

此外,你 thead 布局也无效。它应该是这样的:

<thead>
    <tr>
        <th>headers</th>
        <th>headers</th>
        <th>headers</th>
        <th>headers</th>
    </tr>
</thead>

使用 W3C validator 如果你不确定你的HTML语法是否正确。

试试这个,

div 应该在里面 td 作为 tr 无法接受 div 直接。

所以:

 <table class="table">
      <thead>
           <th>headers</th>
           <th>headers</th>
           <th>headers</th>
           <th>headers</th>
      </thead>
      <tr>
           <td> data </td>
           <td> data </td>
           <!-- This line -->
           <td>
               {% include 'results/other_templates/data_details.html' %}
           </td>
      </tr>
 </table>

编辑

正如@Magiczne所建议的那样, th 也应该在里面 tr :

  <thead>
      <tr>
         <th>headers</th>
         <th>headers</th>
         <th>headers</th>
         <th>headers</th>
      </tr>
  </thead>

此外,你的 data_details.html 也应固定为sthg,如:

<div id="{{obj.id}}-detail">
    <table>
        <tr>
            <td>blah blah blah</td>
            <td>blah blah blah</td>
        </tr>
    </table>
</div>