nomadcoders#1.2 First Rule of Flexbox

potato03kth · Feb 25, 2020 · 5122f38 · 5122f38
1 parent 8565ff3
commit 5122f38
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 15 deletions.
diff --git a/index.html b/index.html
@@ -7,8 +7,10 @@
     <title>(S)CSS Masterclass</title>
   </head>
   <body>
-    <div class="box">1</div>
-    <div class="box">2</div>
-    <div class="box">3</div>
+    <div class="wrapper">
+      <div class="box">1</div>
+      <div class="box">2</div>
+      <div class="box">3</div>
+    </div>
   </body>
 </html>
diff --git a/styles.css b/styles.css
@@ -1,15 +1,10 @@
-.box {
-  background: blue;
-  width: 300px;
-  height: 300px;
-  display: inline-block;
-  color: white;
-}
-
-.box:nth-child(2) {
-  margin-left: 35px;
+.wrapper {
+  display: flex;
 }
 
-.box:nth-child(3) {
-  margin-left: 20px;
+.box {
+  width: 200px;
+  height: 200px;
+  background: peru;
+  color: white;
 }