alternative - nav bar not extending entirely to left

static/css/styles2.css

@@ -14,8 +14,7 @@
     }
 
     .wrapper nav {
-        padding-top: 0;
-        padding-bottom: 0;
+        padding: 0;
     }
 
     a {
@@ -30,6 +29,8 @@
         justify-content: space-between;
     }
 
+
+
     footer ul {
         list-style: none;
         display: flex;
@@ -241,6 +242,10 @@
         padding: 0.2em;
     }
 
+    nav a {
+        margin: 1em;
+    }
+    
     nav a,
     nav a i {
         color: white;
@@ -253,6 +258,11 @@
         background: white;
     }
 
+    nav li.selected {
+        color: #1c75bc;
+        background: white;
+    }        
+    
     .nav-active,
     .nav-active a,
     .nav-active a i {
@@ -326,7 +336,7 @@
     grid-template-areas: 
     "header  header"
         "user user"
-      "nav     nav"
+      "sidebar     nav"
       "sidebar content"
       "ad      footer";
   }
@@ -352,7 +362,7 @@
     grid-template-columns: 1fr 4fr 1fr;
     grid-template-areas: 
     "header header  user"
-        "nav nav  nav"
+        "sidebar nav  nav"
       "sidebar     content content"
       "sidebar     content content"
       "sidebar  footer footer"