diff --git a/web/src/components/ui/card.tsx b/web/src/components/ui/card.tsx
index 88d52b7..d4066f0 100644
--- a/web/src/components/ui/card.tsx
+++ b/web/src/components/ui/card.tsx
@@ -3,16 +3,29 @@ import type { FC, ReactNode } from "react";
 interface ComponentProps {
   children: ReactNode;
   className?: string;
+  spacing?: boolean;
 }
 
 export const Card: FC<ComponentProps> = ({ children, className }) => {
   return (
-    <div className={`bg-white sm:rounded-lg shadow-md ${className || ""}`}>
+    <div
+      className={`bg-white sm:rounded-lg overflow-hidden shadow-md ${
+        className || ""
+      }`}
+    >
       {children}
     </div>
   );
 };
 
-export function CardContent({ children, className }: ComponentProps) {
-  return <div className={`p-4 ${className || ""}`}>{children}</div>;
+export function CardContent({
+  children,
+  className,
+  spacing = true,
+}: ComponentProps) {
+  return (
+    <div className={`${spacing ? "p-4 " : ""}${className || ""}`}>
+      {children}
+    </div>
+  );
 }