diff --git a/src/components/BeerById/BeerPostCommentsSection.tsx b/src/components/BeerById/BeerPostCommentsSection.tsx
index fa0bd32..8340f67 100644
--- a/src/components/BeerById/BeerPostCommentsSection.tsx
+++ b/src/components/BeerById/BeerPostCommentsSection.tsx
@@ -46,9 +46,9 @@ const BeerPostCommentsSection: FC<BeerPostCommentsSectionProps> = ({ beerPost })
 
   const sectionRef: MutableRefObject<HTMLDivElement | null> = useRef(null);
   return (
-    <div className="w-full space-y-3">
-      <div className="card h-96 bg-base-300">
-        <div className="card-body h-full" ref={sectionRef}>
+    <div className="w-full space-y-3" ref={sectionRef}>
+      <div className="card bg-base-300">
+        <div className="card-body h-full">
           {user ? (
             <BeerCommentForm beerPost={beerPost} mutate={mutate} />
           ) : (
diff --git a/src/pages/beers/index.tsx b/src/pages/beers/index.tsx
index 4348ba1..f02693e 100644
--- a/src/pages/beers/index.tsx
+++ b/src/pages/beers/index.tsx
@@ -16,7 +16,7 @@ import { FaArrowUp } from 'react-icons/fa';
 const BeerPage: NextPage = () => {
   const { user } = useContext(UserContext);
 
-  const PAGE_SIZE = 2;
+  const PAGE_SIZE = 6;
 
   const { beerPosts, setSize, size, isLoading, isLoadingMore, isAtEnd } = useBeerPosts({
     pageSize: PAGE_SIZE,