Calculators/DayCalculator/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="DayCalculator.css">
    <link rel="icon" href="DayCalculator.png">
    <script src="DayCalculator.js"></script>
    <title>Day Calculator</title>
</head>
<body>
    <center>
        <div style="border: 5px;border-color: white;border-style: dashed;border-radius: 100px;background-color: black;height: auto; width: 750px;">
        <br><br>
        <h1 style="color: aquamarine"><b><i><u>Day Calculator</u></i></b></h1>
    <br><br>
        <table style="border-radius: 3px;">
            <tr>
            <td><h2>Date :- </h2></td>
            <td>
                <input type="number" name="Date" id="date" min="1" max="31" placeholder="1"><br>
            </td>
        </tr>
        <tr>
            <td><h2>Month :- </h2></td>
            <td>
                <input type="number" name="Month" id="month" min="1" max="12" placeholder="1"><br>
            </td>
        </tr>
        <tr>
            <td><h2>Year :- </h2></td>
            <td>
                <input type="number" name="Year" id="year" min="1000" max="9999" placeholder="2022"><br>
            </td>
        </tr>
    </table>
    <h2 id="h2"></h2>
    <button type="submit" onclick="CalculateTheDay()" id="button">Submit</button>
    <br>
    </div>    
</center>
</body>
</html>