fixing text category

bayue48 · Nov 17, 2020 · 01a57f2 · 01a57f2
1 parent d926544
commit 01a57f2
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 3 deletions.
diff --git a/index.html b/index.html
@@ -117,7 +117,7 @@ <h2 class="text">Category</h2>
 					<p class="caption">Pants</p>
 				</div>
 				<div class="col-12 col-sm-12 col-md-auto col-lg-2 rounded box" style="background-color: #57CD9E;">
-					<img src="./assets/shoes.png" alt="Shoes" class="img-fluid mx-auto mt-5 category-img">
+					<img src="./assets/shoes.png" alt="Shoes" class="img-fluid mx-auto category-img">
 					<p class="caption">Shoes</p>
 				</div>
 			</div>

diff --git a/main.css b/main.css
@@ -120,15 +120,22 @@ body {
 }
 
 .category-img {
-	margin-top: 30px;
+	margin: 0;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
 }
 
 .caption {
 	font-weight: bold;
   font-size: 30px;
   line-height: 30px;
   color: #FFFFFF;
-  margin-top: -80px; 
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%); 
 }
 
 /* New and Popular */