more css

elin001 · Oct 23, 2023 · 06749ef · 06749ef
1 parent 033b5c8
commit 06749ef
Show file tree

Hide file tree

Showing 2 changed files with 49 additions and 14 deletions.
diff --git a/portfolio.html b/portfolio.html
@@ -29,5 +29,13 @@ <h1>Portfolio</h1>
                 </nav>
     </div>
 </div>
+
+<main id="content">
+    <div class="portfolio">
+        <div class="byline"></div>
+    </div>
+
+</main>
+
 </body>
 </html>
diff --git a/style.css b/style.css
@@ -1,9 +1,14 @@
+main{
+    display: flex;
+}
+
 body {
 background-color: #f5f5f5;
 margin: 50px;
 padding: 0;
 display: flex;
 flex-direction: column;
+flex-wrap: wrap;
 font-family: 'DM Sans', sans-serif, Arial, Helvetica, sans-serif
 }
 
@@ -30,19 +35,6 @@ p {
     font-family: 'DM Sans', sans-serif, Arial, Arial, Helvetica, sans-serif;
 }
 
-@media screen and (max-width: 768px) {
-    /* Define styles for mobile viewports with a maximum width of 768px */
-    .hamburger-menu {
-        position: fixed;
-        top: 20px; /* Adjust the top position for mobile */
-        right: 20px; /* Adjust the right position for mobile */
-    }
-    body {
-        margin: 0;
-        padding: 0;
-    }
-}
-
 .hamburger-menu {
     position: fixed;
     top: 90px; 
@@ -226,4 +218,39 @@ input:checked ~ span:nth-last-child(2) {
 
   .resume-date {
     font-style: italic;
-  }
+  }
+
+  .portfolio{
+    display: flex;
+
+  }
+
+  .byline {
+
+  }
+
+  @media screen and (max-width: 600px) {
+    body {
+        display: flex;
+        margin: 50px;
+        padding: 0;
+    }
+
+    h1{
+        size: 3em;
+    }
+
+    .resume{
+        display: flex;
+        flex-direction: column;
+        width: auto;
+        margin: auto;
+        margin-bottom: 0px;
+    }
+
+    .hamburger-menu {
+        position: fixed;
+        top: 20px; /* Adjust the top position for mobile */
+        right: 20px; /* Adjust the right position for mobile */
+    }
+}