Page became responsive

Mehrabios · Dec 29, 2023 · ca89df3 · ca89df3
1 parent 7ea9f57
commit ca89df3
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 1 deletion.
diff --git a/index.html b/index.html
@@ -9,7 +9,7 @@
 </head>
 <body>
     <main>
-        <h1>Hi everyone! Welocome to mehrabios.github.io.</h1>
+        <h1>Hi everyone, Welocome!</h1>
         <p>Hello to all! Welcome to this repository. In this repository, I am going to introduce myself and put my portfolio and how to contact me. If you are interested in working with me or want to connect with me, I suggest you check out this repository.</p>
         <figure>
             <img class="Mehrabios" src="./Image/Mehrabios_Profile.jpg" alt="Mehrabios" width="75%">

diff --git a/style.css b/style.css
@@ -8,6 +8,7 @@
 }
 body {
     margin: 0px;
+    width: 100%;
 }
 main , h1 , h2 , h3 , p , span , a , figcaption , figure {
     background-color: #ffffff;
@@ -59,4 +60,22 @@ a {
 a:hover , .id:hover {
     text-decoration: underline;
     cursor: pointer;
+}
+@media only screen and (max-width: 768px) {
+    main {
+        width: 95%;
+        margin: 10px auto;
+    }
+    h1 {
+        font-size: 2.3rem;
+        width: 100%;
+    }
+    p , span , a {
+        font-size: 1rem;
+    }
+}
+@media only screen and (max-width: 1024px) {
+    main {
+        width: 90%;
+    }
 }