fixed homapage layout structure

src/components/Feed/Feed.css

@@ -1,4 +1,3 @@
 .feed {
-    flex: 4.7;
-    padding: 30px 30px 0 30px;
+    width: 100%;
 }

src/components/RightBar/RightBar.css

@@ -1,4 +1,4 @@
 .rightBar {
-    flex: 2.1;
+    width: 100%;
     background-color: rgba(255, 255, 255, 0);
 }

src/components/SideBar/SideBar.css

@@ -1,6 +1,7 @@
 .sideBar {
-    margin-top: 30px;
-    flex: 1.7;
+    /* margin-top: 30px; */
+    /* flex: 1.7; */
+    width: 100%;
     /* min-height: calc(100vh - 70px); */
     height: fit-content;
     /* padding: 10px 0; */

src/components/TopPicks/TopPicks.css

@@ -1,5 +1,5 @@
 .topPicks {
-    margin-top: 30px;
+    /* margin-top: 30px; */
     width: 100%;
     /* padding-top:  10px; */
     background-color: #fff;

src/pages/Homepage/Homepage.css

@@ -1,15 +1,46 @@
 .homepage {
+    position: relative;
     max-width: 1000px;
     margin: 0 auto;
-    position: relative;
+    height: 100vh;
+    overflow-y: hidden;
+    display: flex;
     background-color: rgb(240, 240, 240);
+    transform: translateZ(0);
 }
 
 main {
+    position: relative;
+    margin-top: auto;
     width: 100%;
-    min-height: calc(100vh - 70px);
+    padding: 0 30px;
+    height: calc(100vh - 70px);
     display: flex;
-    /* background-color: rgb(240, 240, 240); */
+    overflow-y: hidden;
+}
+
+.leftViewContainer {
+    flex: 1.7;
+}
+
+.feedViewContainer {
+    flex: 4.7;
+    margin-left: auto;
+    padding: 0 30px 0 30px;
+}
+
+.rightViewContainer {
+    flex: 2.1;
+}
+
+.viewsOverflowStyle {
+    overflow-x: hidden;
+    overflow-y: auto;
+    -ms-overflow-style: none;  /* IE and Edge */
+    scrollbar-width: none;  /* Firefox */
 }
 
 
+.viewsOverflowStyle::-webkit-scrollbar {
+    display: none;
+}

src/pages/Homepage/Homepage.js

@@ -9,13 +9,19 @@ const Homepage = () => {
     return (
         <div className='homepage'>
             {/* Header */}
-            <Header homePage/>
+            {/* <Header homePage/> */}
 
             {/* Main Section */}
             <main>
-                <SideBar />
-                <Feed />
-                <RightBar />
+                <div className='leftViewContainer viewsOverflowStyle'>
+                    <SideBar />
+                </div>
+                <div className='feedViewContainer viewsOverflowStyle'>
+                    <Feed />
+                </div>
+                <div className='rightViewContainer viewsOverflowStyle'>
+                    <RightBar />
+                </div>
             </main>
 
         </div>