diff --git a/web/src/layouts/BlogLayout/BlogLayout.js b/web/src/layouts/BlogLayout/BlogLayout.js
index 6809e82..66dcff8 100644
--- a/web/src/layouts/BlogLayout/BlogLayout.js
+++ b/web/src/layouts/BlogLayout/BlogLayout.js
@@ -6,7 +6,7 @@ const BlogLayout = ({ children }) => {
 
   return (
     <>
-      <header className="flex justify-between items-center py-4 px-8 bg-blue-700 text-white">
+      <header className="relative flex justify-between items-center py-4 px-8 bg-blue-700 text-white">
         <h1 className="text-5xl font-semibold tracking-tight">
           <Link
             className="text-blue-400 hover:text-blue-100 transition duration-100"
@@ -42,12 +42,12 @@ const BlogLayout = ({ children }) => {
                 {isAuthenticated ? 'Log Out' : 'Log In'}
               </a>
             </li>
-            {isAuthenticated && (
-              <li className="absolute top-0 right-0 -mt-8 px-4 text-xs text-blue-300">
-                {currentUser.email}
-              </li>
-            )}
           </ul>
+          {isAuthenticated && (
+            <div className="absolute bottom-1 right-0 mr-12 text-xs text-blue-300">
+              {currentUser.email}
+            </div>
+          )}
         </nav>
       </header>
       <main className="max-w-4xl mx-auto p-12 bg-white shadow rounded-b">