diff --git a/src/assets/css/hide-scrollbar.scss b/src/assets/css/hide-scrollbar.scss
index fe32d78..63fe0e5 100644
--- a/src/assets/css/hide-scrollbar.scss
+++ b/src/assets/css/hide-scrollbar.scss
@@ -1,15 +1,10 @@
-body {
+.hide-scrollbar-mask {
+  width: 100%;
+  height: 100%;
   overflow: hidden;
 }
 
-#root {
-  height: 100vh;
-  width: 100vw;
-}
-
-#hide-scrollbar {
+.hide-scrollbar-selection {
   position: relative;
-  height: 100vh;
-  width: 100vw;
   overflow: scroll;
 }
\ No newline at end of file
diff --git a/src/components/HideScrollbar.tsx b/src/components/HideScrollbar.tsx
index 2d61017..52a4644 100644
--- a/src/components/HideScrollbar.tsx
+++ b/src/components/HideScrollbar.tsx
@@ -151,15 +151,17 @@ const HideScrollbar = forwardRef<HideScrollbarElement, PropsWithChildren>((props
 
     return (
         <>
-            <div
-                ref={rootRef}
-                id={'hide-scrollbar'}
-                style={{
-                    width: `calc(100vw + ${verticalScrollbarWidth}px)`,
-                    height: `calc(100vh + ${horizontalScrollbarWidth}px`
-                }}
-            >
-                {props.children}
+            <div className={'hide-scrollbar-mask'}>
+                <div
+                    ref={rootRef}
+                    className={'hide-scrollbar-selection'}
+                    style={{
+                        width: `calc(100vw + ${verticalScrollbarWidth}px)`,
+                        height: `calc(100vh + ${horizontalScrollbarWidth}px`
+                    }}
+                >
+                    {props.children}
+                </div>
             </div>
         </>
     )