Added sections

2026-02-07 20:09:31 +00:00
parent bf80433f42
commit 683c931e9c
2 changed files with 59 additions and 1 deletions
--- a/index.html
+++ b/index.html
@ -7,5 +7,17 @@
    </head>

    <body>
+        <header><div>
+        </div></header>
+        <main>
+        </main>
+        <footer>
+            <!-- Left side -->
+            <div>
+            </div>
+            <!-- Right side -->
+            <div>
+            </div>
+        </footer>
    </body>
 </html>
--- a/styles.css
+++ b/styles.css
@ -1,5 +1,51 @@
+:root {
+    --header-size: 100px;
+}
+
+
+
+html, body {
+    width: 100%;
+    height: 100%;
+    margin: 0;
+}
+
 body {
    background-color: #000000;
    color: #FFFFFF;
    font-family: sans-serif;
-}
+    display: flex;
+    flex-flow: column;
+}
+
+
+
+header main footer {
+    width: 100%;
+}
+
+header {
+    position: fixed;
+    top: 0;
+}
+
+/* Required to set the width and height of the header, as `fixed` elements can't have their size set. */
+header > div {
+    width: 100vw;
+    height: var(--header-size);
+}
+
+main {
+    flex: 1 1 auto;
+    margin-top: var(--header-size);
+    text-align: center;
+}
+
+footer {
+    flex: 0 1 auto;
+    display: flex;
+}
+
+footer > div {
+    width: 50%;
+}