Merge pull request #296 from Albert-2/footerUI

footer UI updated
Kritika30032002 · Dec 14, 2023 · dea5f57 · dea5f57
2 parents 2efa057 + a592fd1
commit dea5f57
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 8 deletions.
diff --git a/index.html b/index.html
@@ -147,19 +147,21 @@ <h3 class="mt-4 text-center" id="heading-tasks">Tasks</h3>
     </div>
   </div>
   <br /><br />
-  <h2 style="text-align: center" class="mt-2 animate__animated animate__fadeInUp animate__slow  animate__delay-3s">Why Simply Tasked?</h2>
-  <p style="text-align: center" class="mb-4 animate__animated animate__fadeInUp animate__slow  animate__delay-3s">
+  <div >
+  <h2 style=" text-align: center" class="mt-2 animate__animated animate__fadeInUp animate__slow  animate__delay-3s">Why Simply Tasked?</h2>
+  <p style="padding: 0px 10px; text-align: center" class="mb-4 animate__animated animate__fadeInUp animate__slow  animate__delay-3s">
     Simply, because it is a SIMPLE To-Do List Tool to organize your tasks
     efficiently.
   </p>
 
   <div class="list mb-5 animate__animated animate__fadeInUp animate__slow  animate__delay-3s " style="text-align: center ">
-    <ul>
-      <li>Intuitive task management</li>
-      <li>Seamless due date tracking</li>
-      <li>Beautiful and user-friendly design</li>
+    <ul >
+      <li >Intuitive task management</li>
+      <li >Seamless due date tracking</li>
+      <li >Beautiful and user-friendly design</li>
     </ul>
   </div>
+  </div>
 
 
   <script src="index.js"></script>

diff --git a/style.css b/style.css
@@ -979,11 +979,14 @@ ul {
   list-style-type: disc;
   padding: 0;
   display: flex; /* Use flexbox to make the list items horizontal */
-  justify-content: center; /* Center the list items horizontally */
+  justify-content: space-evenly; /* Center the list items horizontally */
+  align-items: center;
+  flex-wrap: wrap;
+  width: 100vw;
 }
 
 li {
-  margin: 0 100px; /* Add some spacing between list items */
+  margin:10px;
 }
 
 .voice-input{