diff --git a/app/(home-pages)/p/[didOrHandle]/PostsContent.tsx b/app/(home-pages)/p/[didOrHandle]/PostsContent.tsx
index d8fbea2d..eb841838 100644
--- a/app/(home-pages)/p/[didOrHandle]/PostsContent.tsx
+++ b/app/(home-pages)/p/[didOrHandle]/PostsContent.tsx
@@ -68,7 +68,7 @@ export const ProfilePostsContent = (props: {
   }
 
   return (
-    <div className="flex flex-col gap-2 text-left relative">
+    <div className="flex flex-col gap-3 text-left relative">
       {allPosts.map((post) => (
         <PostListing key={post.documents.uri} {...post} />
       ))}
diff --git a/app/(home-pages)/p/[didOrHandle]/ProfileHeader.tsx b/app/(home-pages)/p/[didOrHandle]/ProfileHeader.tsx
index 2a658cc3..959ed0ff 100644
--- a/app/(home-pages)/p/[didOrHandle]/ProfileHeader.tsx
+++ b/app/(home-pages)/p/[didOrHandle]/ProfileHeader.tsx
@@ -83,7 +83,7 @@ export const ProfileHeader = (props: {
             ? parseDescription(profileRecord.description)
             : null}
         </pre>
-        <div className=" w-full overflow-x-scroll mt-3 mb-6 ">
+        <div className=" w-full overflow-x-scroll py-3 mb-3 ">
           <div
             className={`grid grid-flow-col  gap-2 mx-auto w-fit px-3 sm:px-4 ${props.popover ? "auto-cols-[164px]" : "auto-cols-[164px] sm:auto-cols-[240px]"}`}
           >
diff --git a/app/(home-pages)/p/[didOrHandle]/ProfileLayout.tsx b/app/(home-pages)/p/[didOrHandle]/ProfileLayout.tsx
index 9661c35c..a298dec3 100644
--- a/app/(home-pages)/p/[didOrHandle]/ProfileLayout.tsx
+++ b/app/(home-pages)/p/[didOrHandle]/ProfileLayout.tsx
@@ -3,26 +3,22 @@
 import { useCardBorderHidden } from "components/Pages/useCardBorderHidden";
 
 export function ProfileLayout(props: { children: React.ReactNode }) {
-  let borderHidden = useCardBorderHidden();
+  let cardBorderHidden = useCardBorderHidden();
   return (
-    <div className="h-full">
-      <div
-        id="profile-content"
-        className={`
+    <div
+      id="profile-content"
+      className={`
           ${
-            borderHidden
+            cardBorderHidden
               ? ""
-              : "h-full border border-border-light rounded-lg overflow-y-scroll"
+              : "overflow-y-scroll h-full border border-border-light rounded-lg  bg-bg-page"
           }
-          max-w-prose
-          mx-auto
-    w-full
-    flex flex-col
-    text-center
+          max-w-prose mx-auto w-full
+          flex flex-col
+          text-center
     `}
-      >
-        {props.children}
-      </div>
+    >
+      {props.children}
     </div>
   );
 }
diff --git a/app/(home-pages)/p/[didOrHandle]/ProfileTabs.tsx b/app/(home-pages)/p/[didOrHandle]/ProfileTabs.tsx
index 2b9f32ce..4609a0a1 100644
--- a/app/(home-pages)/p/[didOrHandle]/ProfileTabs.tsx
+++ b/app/(home-pages)/p/[didOrHandle]/ProfileTabs.tsx
@@ -13,13 +13,14 @@ export const ProfileTabs = (props: { didOrHandle: string }) => {
   const currentTab = (segment || "posts") as ProfileTabType;
   const [scrollPosWithinTabContent, setScrollPosWithinTabContent] = useState(0);
   const [headerHeight, setHeaderHeight] = useState(0);
-
   useEffect(() => {
     let headerHeight =
       document.getElementById("profile-header")?.clientHeight || 0;
     setHeaderHeight(headerHeight);
 
-    const profileContent = document.getElementById("profile-content");
+    const profileContent = cardBorderHidden
+      ? document.getElementById("home-content")
+      : document.getElementById("profile-content");
     const handleScroll = () => {
       if (profileContent) {
         setScrollPosWithinTabContent(
@@ -37,8 +38,7 @@ export const ProfileTabs = (props: { didOrHandle: string }) => {
   }, []);
 
   const baseUrl = `/p/${props.didOrHandle}`;
-  const bgColor = "255 255 255";
-  // const bgColor = !cardBorderHidden ? "var(--bg-leaflet)" : "var(--bg-page)";
+  const bgColor = cardBorderHidden ? "var(--bg-leaflet)" : "var(--bg-page)";
 
   return (
     <div className="flex flex-col w-full sticky top-3 sm:top-4 z-20 sm:px-4 px-3">