diff --git a/frontend/src/Navigation.tsx b/frontend/src/Navigation.tsx
index 87bab842..336ec95b 100644
--- a/frontend/src/Navigation.tsx
+++ b/frontend/src/Navigation.tsx
@@ -228,7 +228,7 @@ export default function Navigation({ navOpen, setNavOpen }: NavigationProps) {
           className={({ isActive }) =>
             `${
               isActive ? 'bg-gray-3000' : ''
-            } group mx-4 mt-4 flex cursor-pointer gap-2.5 rounded-3xl border border-silver p-3 hover:border-rainy-gray hover:bg-gray-3000`
+            } group my-auto mx-4 mt-4 flex cursor-pointer gap-2.5 rounded-3xl border border-silver p-3 hover:border-rainy-gray hover:bg-gray-3000`
           }
         >
           <img
@@ -240,9 +240,9 @@ export default function Navigation({ navOpen, setNavOpen }: NavigationProps) {
             New Chat
           </p>
         </NavLink>
-        <p className="ml-6 mt-3 text-sm font-semibold">Chats</p>
         {conversations && (
-          <div className="conversations-container mb-auto max-h-[25rem] overflow-y-auto">
+          <div className="conversations-container max-h-[25rem] overflow-y-auto">
+            <p className="ml-6 mt-3 text-sm font-semibold">Chats</p>
             {conversations?.map((conversation) => (
               <ConversationTile
                 key={conversation.id}
@@ -332,7 +332,7 @@ export default function Navigation({ navOpen, setNavOpen }: NavigationProps) {
             }
           >
             <img src={SettingGear} alt="info" className="ml-2 w-5 opacity-60" />
-            <p className="my-auto text-eerie-black">Settings</p>
+            <p className="my-auto text-sm text-eerie-black">Settings</p>
           </NavLink>
         </div>