带有模态弹出窗口的 html 表格

Question

更新.....

我希望任何人都可以解决这个问题

当我使用

<td>

标签在模态弹出窗口中显示我的数据时，表格显示分散...

当使用

<h5>

标签时一切都OK

这是我的模态代码

<div id="myModal<?php echo $row['id'];
            $x = $row['id'];
            ?>" class="modal fade" role="dialog">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                     <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <div class="modal-body">
                <?php 
                  $records = mysqli_query($conn,"select * from trans where id =  $x ");  
                  while($row = mysqli_fetch_array($records))
                    {
                    ?>                      
                    <!--
                         <td> <?php echo $row['id']; ?></td>
                         <td> <?php echo $row['date']; ?></td>
                         <td> <?php echo $row['invNO']; ?></td>
                         <td> <?php echo $row['income']; ?></td> 
                    --> 
                    
                     <h6>ID : <?php echo $row['id']; ?></h6>
                     <h6>Date : <?php echo $row['date']; ?></h6>
                     <h6>inv No : <?php echo $row['invNO']; ?></h6>
                     <h6>income : <?php echo $row['income']; ?></h6>
                <?php
                    }
                ?>
                </div>
            </div>
        </div>
    </div>

Answer 1

来自 MDN，它指出：

只能在 元素内使用。

您遇到的情况可能是浏览器的怪癖，它会重新排列您的 HTML 输出，并将您的

<td>

元素放在您不期望的位置。

要解决此问题，您应该将

<td>

元素替换为其他内容（就像您对标题标签所做的那样），或者记住将单元格包裹在

<table />

和

<tr />

标签内。