Added responsiveness to PizzaCorner

arpit456jain · Oct 26, 2023 · 00d6c78 · 00d6c78
1 parent 1d19f34
commit 00d6c78
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 10 deletions.
diff --git a/Art Gallery Website/index.html b/Art Gallery Website/index.html
@@ -22,10 +22,12 @@
                 </nav>
             </div>
             <div class="content">
-                <h1>Abstract :</h1>
-                <h2>something mysterious<br>but beautiful at the same time!</h2>
-                <h3>(move the cursor to the image to see the beauty of <br>abstract art)</h3>
-                <br>
+                <div>
+                    <h1>Abstract :</h1>
+                    <h2>something mysterious<br>but beautiful at the same time!</h2>
+                    <h3>(move the cursor to the image to see the beauty of <br>abstract art)</h3>
+                    <br>
+                </div>
                 <a href="gallery.html"><button>Gallery</button></a>
             <div class="img">
             <div class="hero">

diff --git a/Art Gallery Website/style.css b/Art Gallery Website/style.css
@@ -46,9 +46,8 @@ p#footer {
     height: 250px;
 }
 .navbar{
-    width: 100%;
+    width: 100vw;
     height: 15vh;
-    margin: auto;
     display: flex;
     align-items: center;
 }
@@ -343,3 +342,4 @@ p{
         background-size: 100% 100%;
     }
 }
+/* @media screen and (max-width:) */
diff --git a/PizzaCorner_NewInterface/index.html b/PizzaCorner_NewInterface/index.html
@@ -31,8 +31,9 @@
 
 		<div class="Main">
 
-				<img src="img/pizza.png" />
-
+				<div class="imgpizza">
+					<img src="img/pizza.png" id="imgg" />
+				</div>
 			<div class="main_right">
 				<h1>
 					We Devliver Quality And Cheesy Pi<span style="color:#ff9f00 ;">zz</span>a

diff --git a/PizzaCorner_NewInterface/style.css b/PizzaCorner_NewInterface/style.css
@@ -67,7 +67,6 @@ body
 	justify-content: center;
 	align-items: center;
 }
-
 section img
 {	
 	width: 100%;
@@ -451,12 +450,17 @@ li{
 		flex-direction: column-reverse;
 	}
 	.Main img{
-		position: absolute;
 		width: 50%;
 		left: 15em;
 		top: 22em;
 		z-index: -1;
 	}
+	.imgpizza{
+		width: 400px;
+	}
+	#imgg{
+		width: 100%;
+	}
 	.about{
 		text-align: center;
 		padding: 7em 4em ;