diff --git a/src/pages/sicp/Sicp.tsx b/src/pages/sicp/Sicp.tsx
index b3abcc199a..74f2bbc9cd 100644
--- a/src/pages/sicp/Sicp.tsx
+++ b/src/pages/sicp/Sicp.tsx
@@ -109,12 +109,12 @@ const Sicp: React.FC<SicpProps> = props => {
   }, [section]);
 
   // Scroll to correct position
-  React.useLayoutEffect(() => {
+  React.useEffect(() => {
     const hash = props.location.hash;
 
     if (!hash) {
       if (topRef.current) {
-        topRef.current.scrollIntoView();
+        topRef.current.scrollIntoView({ block: 'nearest', behavior: 'smooth' });
       }
       return;
     }
@@ -122,9 +122,9 @@ const Sicp: React.FC<SicpProps> = props => {
     const ref = refs.current[hash];
 
     if (ref) {
-      ref.scrollIntoView({ block: 'start' });
+      ref.scrollIntoView({ block: 'nearest', behavior: 'smooth' });
     }
-  }, [props.location.hash, data]);
+  }, [props.location.hash]);
 
   // Close all active code snippet when new page is loaded
   React.useEffect(() => {
diff --git a/src/styles/_sicp.scss b/src/styles/_sicp.scss
index bc4ace2f91..1b1557100f 100644
--- a/src/styles/_sicp.scss
+++ b/src/styles/_sicp.scss
@@ -41,7 +41,6 @@ $sicp-background-color: #ffffff;
     margin: 1em auto;
     padding: 0 6em;
     max-width: 1050px;
-
     height: fit-content;
     background-color: $sicp-background-color;