Question

我试图将所有这三个数据并排放置。就像第二行的最后一列。但是在第一列之后（在php循环中）第3和第4个元素到达下线。 screenshot

这是我尝试过的（包括样式在线。

<?php while ($each_row = mysqli_fetch_assoc($table_data)){ ?>
                        <tr style="border: 1px solid black; ">
                            <td style="border: 1px solid black;"><?php echo $i; ?></td>
                            <td style="border: 1px solid black;"><?php echo $each_row["roll"]; ?></td>
                            <td style="border: 1px solid black;"><?php echo $each_row["name"]; ?></td>
                            <td style="border: 1px solid black; text-align:center;"><?php echo $each_row["present"]; ?></td>
                            <td style="border: 1px solid black; width: 300px;">
                                    <a href="attendence.php?change=present&date=<?php echo $today; ?>&class=<?php echo $class; ?>&batch=<?php echo $batch; ?>&roll=<?php echo $each_row["roll"]; ?>">
                                        <button type="button" name="button">Present</button></a>
                                    <a href="attendence.php?change=absent&date=<?php echo $today; ?>&class=<?php echo $class; ?>&batch=<?php echo $batch; ?>&roll=<?php echo $each_row["roll"]; ?>">
                                        <button type="button" name="button">Absent</button></a>
                                    <form class="" style="width: 100px;" action="attendence.php?change=absent&date=<?php echo $today; ?>&class=<?php echo $class; ?>&batch=<?php echo $batch; ?>&roll=<?php echo $each_row["roll"]; ?>" method="post">
                                        <input style="width: 50px;" type="text" name="late" value="0">
                                        <input style="width: 50px;" type="submit" name="" value="Late">
                                    </form>
                            </td>
                        </tr>
      <?php } ?>

Answer 1

我对您的设计有不同的看法，您可能很难消化，但您可以使用BOOTSTRAP框架并使用简单的网格使用<div>或<span>标签设计相同的内容在表格视图中（也会响应）并使您的表单看起来更好。

供参考：Bootstrap Grid System

Answer 2

您可能想尝试以下结构。考虑在主<form>之外使用单个<table>标记，并使用<a>周围的<button>锚点来考虑 not 。

<form method="post">
    <table style="width: 100%">
        <?php while ($each_row = mysqli_fetch_assoc($table_data)){ ?>
        <tr style="border: 1px solid black;">
            <td style="border: 1px solid black;">1</td>
            <td style="border: 1px solid black;">2</td>
            <td style="border: 1px solid black;">3</td>
            <td style="border: 1px solid black; text-align:center;">4</td>
            <td style="border: 1px solid black; width: 300px;">
                <a href="#YourUrlHere"><!--CONSIDER REMOVING THIS ANCHOR-->
                    <button type="button" name="button">Present</button>
                </a><!--CONSIDER REMOVING THIS ANCHOR-->
                <a href="#YourUrlHere"><!--CONSIDER REMOVING THIS ANCHOR-->
                    <button type="button" name="button">Absent</button>
                </a><!--CONSIDER REMOVING THIS ANCHOR-->
                <input style="width: 50px;" type="text" name="late" value="0">
                <input style="width: 50px;" type="submit" name="" value="Late">
            </td>
        </tr>
        <?php } ?>
    </table>
</form>

https://jsfiddle.net/ksrgnmcm/#&togetherjs=Nl81IM2PG7

希望它有所帮助。

如何将所有数据保持在并排固定高度的td中

2 个答案: