我可以在Bootstrap 4表之间保留对齐文本吗?

时间:2017-12-07 17:26:04

标签: css bootstrap-4

image showing times and comments not aligned

我试图在不同的表格中保留时间和评论。

<?php
while ($line = mysqli_fetch_array($result, MYSQLI_ASSOC)){
    $time = date("H:i", strtotime($line["event_date"]));
    $date = date_format($nice_date, "l, jS F");
    colours = array("table-active", "table-success", "table-warning", "table-danger", "table-info");
    $i = 0;
    ?>

    //Some checking done here to see if new date. If so, start new table.

    <h2><?php echo $date; ?></h2>

    <div class="container">
        <table class="table table-sm">
            <tbody>
                <tr class=<?php echo $colours[$i % 5]; ?>>
                        <th scope="row"></th>
                        <td><div class="text-sm-left" ><?php echo $time;?></div></td>
                        <td><div class="text-sm-left" ><?php echo $line["comment"];?></div></td>
                </tr>
            </tbody>
        </table>
    </div>

<?php
}
?>

表格打印的时间和注释在表格中对齐,但不是从表格到表格。

我试过使用课程&#34; text-sm-left&#34;没有自己的div。那不行。我已经尝试过课程&#34; text-left&#34;也。那不行。我附上了一张图片,上面显示的是时间和评论超出对齐的表格。

1 个答案:

答案 0 :(得分:0)

这是@wazz和here

的帮助下的解决方案
<?php
while ($line = mysqli_fetch_array($result, MYSQLI_ASSOC)){
    $time = date("H:i", strtotime($line["event_date"]));
    $date = date_format($nice_date, "l, jS F");
    colours = array("table-active", "table-success", "table-warning", "table-danger", "table-info");
    $i = 0;
?>

    //[...]Some checking done here to see if new date. If so, start new table.

    <h2><?php echo $date; ?></h2>

    <div class="container">
        <table class="table">
            <tbody>
                <tr class="row m-0 <?php echo $colours[$i % 5]; ?>">                         
                        <td class="d-inline-block col-2" ><?php echo $time;?></div></td>
                        <td class="d-inline-block col-10" ><?php echo $line["comment"];?></div></td>
                </tr>
            </tbody>
        </table>
    </div>

<?php
}
?>

columns aligned from table to table