Skip to content

Commit 4fe0370

Browse files
fixed the footer
1 parent 9859e3a commit 4fe0370

2 files changed

Lines changed: 11 additions & 10 deletions

File tree

Wireframe/index.html

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<link rel="stylesheet" href="style.css" />
88
</head>
99
<body>
10-
<header>
10+
<header >
1111
<h1> Web Development concepts</h1>
1212
<h2>Some key words you would encouter</h2>
1313
</header>
@@ -47,10 +47,8 @@ <h2>What is the purpose of wireframe </h2>
4747
</article>
4848

4949
</main>
50-
<footer>
51-
<p>
52-
This website is made by Ebrahim Moqbel
53-
</p>
50+
<footer class="footer">
51+
<p>This website is made by Ebrahim Moqbel </p>
5452
</footer>
5553
</body>
5654
</html>

Wireframe/style.css

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ As well as useful links to learn more */
1616
https://web.dev/articles/min-max-clamp
1717
https://scrimba.com/learn-css-variables-c026
1818
====== Design Palette ====== */
19+
1920
:root {
2021
--paper: oklch(7 0 0);
2122
--ink: color-mix(in oklab, var(--color) 5%, black);
@@ -27,12 +28,13 @@ As well as useful links to learn more */
2728
/* ====== Base Elements ======
2829
General rules for basic HTML elements in any context */
2930
body {
30-
background: var(--paper);
31+
background-color:rgba(159, 210, 58, 0.691);
3132
color: var(--ink);
3233
font: var(--font);
3334
}
34-
header {
35+
.header {
3536
text-align: center;
37+
padding: 2px;
3638
}
3739
a {
3840
padding: var(--space);
@@ -53,12 +55,13 @@ main {
5355
max-width: var(--container);
5456
margin: 0 auto calc(var(--space) * 4) auto;
5557
}
56-
footer {
58+
.footer {
5759
position: fixed;
5860
bottom: 0;
5961
text-align: center;
60-
border-style: top solid ;
61-
position-anchor: center;
62+
border-top: 1px solid #000;
63+
background-color: rgba(206, 245, 107, 0.663);
64+
6265
}
6366
/* ====== Articles Grid Layout ====
6467
Setting the rules for how articles are placed in the main element.

0 commit comments

Comments
 (0)