Merge pull request #71 from ShaikArshidBanu/fixing-issue-62

Enhancing the Contact Me section (adjusting content)

index.html

@@ -381,27 +381,27 @@ <h1>Contact Me</h1>
         <div class="contact-info">
             <div class="contact-item">
                 <img src="./assets/mail.svg" alt="Email Icon">
-                <p>Email: <a href="mailto:[email protected]">[email protected]</a></p>
+                <p style="margin:5px">Email: <a href="mailto:[email protected]">[email protected]</a></p>
             </div>
 
             <div class="contact-item">
                 <img src="assets/telephone.png" width="30" height="30" alt="Phone Icon">
-                <p>Phone: <a href="tel:+123456789">+123 456 789</a></p>
+                <p style="margin:5px">Phone: <a href="tel:+123456789">+123 456 789</a></p>
             </div>
 
             <div class="contact-item">
                 <img src="./assets/location.png" width="30" height="30" alt="Address Icon">
-                <p>Address: 123 Main St, Cityville, Country</p>
+                <p style="margin:5px">Address: 123 Main St, Cityville, Country</p>
             </div>
 
             <div class="contact-item">
                 <img src="./assets/linkedin.svg" alt="LinkedIn Icon">
-                <p>LinkedIn: <a href="https://www.linkedin.com/in/yourusername/" target="_blank">Your LinkedIn</a></p>
+                <p style="margin:5px">LinkedIn: <a href="https://www.linkedin.com/in/yourusername/" target="_blank">Your LinkedIn</a></p>
             </div>
 
             <div class="contact-item">
                 <img src="./assets/twitter.svg" alt="Twitter Icon">
-                <p>Twitter: <a href="https://twitter.com/yourusername" target="_blank">Your Twitter</a></p>
+                <p style="margin:5px">Twitter: <a href="https://twitter.com/yourusername" target="_blank">Your Twitter</a></p>
 
             </div>
         </div>

styles.css

@@ -663,7 +663,7 @@ details:has(input:checked) label::before {
       background-color: #f6f6f6;
   }
 
-
+  
 
 @media screen and (max-width: 918px) {
   .box {
@@ -1165,3 +1165,8 @@ blockquote {
   background-color: #3498db;
   border-radius: 6px;
 }
+
+/* contact-item */
+.contact-item{
+ display:flex;
+}