diff --git a/src/components/NavBar/NavBar.jsx b/src/components/NavBar/NavBar.jsx
index e9fb8e4..120967d 100644
--- a/src/components/NavBar/NavBar.jsx
+++ b/src/components/NavBar/NavBar.jsx
@@ -50,7 +50,7 @@ export function NavBar({ user, lists, listPath }) {
 						<div
 							className={
 								isNavOpen
-									? 'z-20 h-screen w-screen block absolute text-darkPurple bg-offWhite left-0 top-0'
+									? 'z-20 h-screen w-full block fixed z-10 text-darkPurple bg-offWhite left-0 top-0'
 									: 'hidden'
 							}
 						>
diff --git a/src/views/Layout.jsx b/src/views/Layout.jsx
index 3832206..85aeee3 100644
--- a/src/views/Layout.jsx
+++ b/src/views/Layout.jsx
@@ -10,7 +10,7 @@ export function Layout({ lists, listPath, user, isLoadingUser }) {
 	};
 
 	return (
-		<div className="w-screen flex flex-col text-poppins min-w-96 bg-puurWhite">
+		<div className="w-full flex flex-col text-poppins min-w-96 bg-puurWhite">
 			<NavBar user={user} lists={lists} listPath={listPath} />
 			<main className="min-h-screen w-full lg:pt-16 xl:w-9/12  xl:mx-auto">
 				{isLoadingUser ? (