无法覆盖引导列宽度限制

时间:2021-02-18 21:28:22

标签: javascript php html css bootstrap-4

我正在尝试制作一个可以在页面上显示信息的表格。我不希望文本换行。我已经做了很多搜索,但似乎无法修复它!我正在使用引导程序,我不知道如何覆盖这里发生的任何类型的限制。请帮忙!

Image of webpage

HTML/PHP 网页

<?php
    function createTable(){
        $maxDays=date('t'); //gets the number of days in a month
        $currentDayOfMonth=date('j'); //gets the current day

        $rows = 14; // define number of rows
        $cols = $maxDays;// define number of columns

//      loops through and creates the table
        for($tr=1;$tr<=$rows;$tr++){
            echo "<tr>";
                for($td=1;$td<=$cols;$td++){
                       echo "<td class='tableCells'>654 kwh</td>";
                }
            echo "</tr>";
        }
    }

function writeDays(){
    $lastDayUTS = mktime (0, 0, 0, date("m"), date('t'), date("Y"));
    $lastDay = date("d", $lastDayUTS);
    $monthName = date("M", $lastDayUTS);
    
    //writes the days above the table
    for($n=1;$n <= $lastDay;$n++){
        echo "<th>$monthName $n</th>";
    }
}

?>


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
</head>
<body>

<div class="container-fluid">
    <div class="row">
        <div class="col-lg-9">
                <table class='table table-hover'>
                <thead>
                <!-- writes the days above the table  -->
                    <?php writeDays(); ?>
                </thead>
                <tbody>
                    <?php
                    //  loops through and puts values into the table
                        createTable();
                    ?>
                </tbody>
            </table>
        </div>
    </div>
</div>
   
    
</body>
</html>

最终目标是将其嵌入页面并溢出 x 轴,以便您可以水平滚动。我希望文本都在一行上(不换行)。非常感谢任何帮助!!!

0 个答案:

没有答案
相关问题