• Guest, before posting your code please take these rules into consideration:
    • It is required to use our BBCode feature to display your code. While within the editor click < / > or >_ and place your code within the BB Code prompt. This helps others with finding a solution by making it easier to read and easier to copy.
    • Don't share a wall of code. All we want is the problem area, the code related to your issue.


    To learn more about how to use our BBCode feature, please click here.

    Thank you, Code Forum.

HTML Table Layout

menator01

King Coder
Just thought it was kind of cool that this can be done with an html table.

index.php
HTML:
<?php
class Pages
{
    public $page;

    function get_page($page)
    {
        switch ($page) {
            case 'link 1':
                echo 'This has some stuff about link 1. Could be anything.';
                break;

            case 'link 2':
                echo 'A bunch of jibberish stuff talking about link 2.';
                break;

            case 'link 3':
                echo 'Another link again? This is link 3 stuff.';
                break;

            case 'about':
                echo 'This is all about you know, the site.';
                break;

            default:
                echo 'Home page';
        }
    }
}

$page = new Pages();
?>

<!DOCTYPE html>
<html lang='us'>

<head>
    <title>My Page</title>
    <link rel="stylesheet" href="style.css">
    <script type="text/javascript" src="clock.js"></script>
</head>

<body>

    <table>
        <tr>
            <th colspan="3">
                <img class="logo" src="images/ratt.svg" width="80px">
                My Page Heading
            </th>
        </tr>

        <tr class="midrow">
            <td class="left">
                <h3>Menu</h3>
                <ul>
                    <li><a href="index.php">Home</li>
                    <li><a href="index.php?page=link 1">Link 1</li>
                    <li><a href="index.php?page=link 2">Link 2</li>
                    <li><a href="index.php?page=link 3">Link 3</li>
                    <li><a href="index.php?page=about">About</li>
                </ul>
            </td>
            <td class="mid">
                <p>
                    <?php
                    $page->get_page($_GET['page']);
                    ?>
                </p>
            </td>
            <td class="right">
                <h3>Current Date / Time</h3>
                <div class="date">
                    <span id="date"><?php echo date("m / d / Y"); ?></span>
                     /
                    <span id="clock"></span>
                </div>
                <script>
                    currentTime();
                </script>
            </td>
        </tr>

        <tr>
            <td colspan="3" class="footer">Gaming-Rat Productions &copy: 11/06/2022</td>
        </tr>
    </table>

</body>

</html>

clock.js
JavaScript:
function currentTime() {
    let date = new Date();
    let hh = date.getHours();
    let mm = date.getMinutes();
    let ss = date.getSeconds();
    let session = "AM";

    if (hh == 0) {
        hh = 12;
    }
    if (hh > 12) {
        hh = hh - 12;
        session = "PM";
    }

    hh = (hh < 10) ? "0" + hh : hh;
    mm = (mm < 10) ? "0" + mm : mm;
    ss = (ss < 10) ? "0" + ss : ss;

    let time = hh + ":" + mm + ":" + ss + " " + session;

    document.getElementById("clock").innerText = time;
    let t = setInterval(function () {
        currentTime()
    }, 1000);
}

design.png
 
Top