diff --git a/src/components/MangaGrid.tsx b/src/components/MangaGrid.tsx
index 8de7e512..d2aaddff 100644
--- a/src/components/MangaGrid.tsx
+++ b/src/components/MangaGrid.tsx
@@ -288,7 +288,7 @@ export const MangaGrid: React.FC<IMangaGridProps> = ({
             clearTimeout(timeout);
         };
     }, [gridLayout]);
-    useEffect(
+    useLayoutEffect(
         () => () => {
             document.body.style.overflowY = 'auto';
         },
diff --git a/src/components/library/LibraryMangaGrid.tsx b/src/components/library/LibraryMangaGrid.tsx
index b1187d71..73c41712 100644
--- a/src/components/library/LibraryMangaGrid.tsx
+++ b/src/components/library/LibraryMangaGrid.tsx
@@ -6,11 +6,11 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useEffect } from 'react';
+import React, { useEffect, useLayoutEffect } from 'react';
 import { StringParam, useQueryParam } from 'use-query-params';
 import { useTranslation } from 'react-i18next';
 import { TManga } from '@/typings';
-import { useLibraryOptionsContext } from '@/components/context/LibraryOptionsContext';
+import { GridLayout, useLibraryOptionsContext } from '@/components/context/LibraryOptionsContext';
 import { IMangaGridProps, MangaGrid } from '@/components/MangaGrid';
 
 interface LibraryMangaGridProps
@@ -37,6 +37,13 @@ export const LibraryMangaGrid: React.FC<LibraryMangaGridProps> = ({
         window.scrollTo(0, 0);
     }, [query, unread, downloaded]);
 
+    useLayoutEffect(() => {
+        document.body.style.overflowY = options.gridLayout === GridLayout.List ? 'auto' : 'scroll';
+        return () => {
+            document.body.style.overflowY = 'auto';
+        };
+    }, []);
+
     return (
         <MangaGrid
             {...gridProps}