only was able to fix length and positioning...

CommuniCare1 · Aug 20, 2024 · 61339d9 · 61339d9
1 parent 8ad403d
commit 61339d9
Showing 1 changed file with 24 additions and 28 deletions.
diff --git a/banner.css b/banner.css
@@ -108,7 +108,7 @@ header button:active {
 }
 
 header label{
-    position: relative; 
+    position: relative;
     font-size: 2.8rem;
     color: #1C3312;
     cursor: pointer;
@@ -229,35 +229,31 @@ header #check{
 }
 
 @media screen and (max-width: 480px) {
-    header {
-        padding: 0.5rem 2%;
-        flex-direction: column;
-        height: auto;
-    }
+    header {padding: 0%;
+        width: 77%;}
 
-    header img {
-        margin-bottom: 10px;
-        left: 0;
-    }
-
-    header nav a {
-        font-size: 16px;
-        margin: 0.5rem 0;
-        text-align: center;
-        display: block;
-    }
+    header img {margin-bottom: 10px;
+        left: -4em;
+        top: 1em;}
 
-    header button {
-        width: 130px;
+    header button {width: 130px;
         font-size: 14px;
         margin: 0.5rem auto;
-        display: block;
-    }
+        display: block;}
 
-    header label {
-        font-size: 2rem;
-        top: -120px;
-        right: -20%;
-    }
-}
-/* Header/Navigation Bar Ends */
+    header label {font-size: 2rem;
+        top: -1.5em;
+        left: 5em;}
+
+    header nav.navbar {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        background-color: #fff; /* Adjust based on your design */
+        position: absolute;
+        top: 4rem; /* Adjust based on your header height */
+        right: 0;
+        width: 100%;
+        display: none; /* Hide by default */}
+
+/* Header/Navigation Bar Ends */