Delete the wrapper width setting so that nav and welcome fill the screen

yinxoxo · Jun 18, 2024 · d18e3c3 · d18e3c3
1 parent 3d30e10
commit d18e3c3
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 4 deletions.
diff --git a/Week1/Assignment2/mediaqueries.css b/Week1/Assignment2/mediaqueries.css
@@ -1,8 +1,9 @@
-@media screen and (min-width: 800px) and (max-width: 1200px) {
+@media screen and (min-width: 1200px) {
   .grid-container {
-    max-width: 100%;
+    margin: 0 auto;
   }
 }
+
 @media screen and (min-width: 500px) and (max-width: 800px) {
   #desktop-nav {
     display: none;

diff --git a/Week1/Assignment2/style.css b/Week1/Assignment2/style.css
@@ -1,10 +1,10 @@
 body {
   margin: 0;
   padding: 0;
+  box-sizing: border-box;
 }
 
 #wrapper {
-  width: 1200px;
   max-width: 100%;
   margin: 0 auto;
 }
@@ -50,10 +50,11 @@ nav {
 }
 
 .grid-container {
+  max-width: 1200px;
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   grid-gap: 20px;
-  margin: 0 40px;
+  margin: 0 20px 20px;
 }
 
 .grid-item {