diff --git a/frontend/src/components/resources/build/index.tsx b/frontend/src/components/resources/build/index.tsx
index 487e14dc2..825c764c2 100644
--- a/frontend/src/components/resources/build/index.tsx
+++ b/frontend/src/components/resources/build/index.tsx
@@ -140,7 +140,7 @@ export const BuildComponents: RequiredResourceComponents = {
             </Card>
           </HoverCardTrigger>
           <HoverCardContent align="start">
-            <div className="grid">
+            <div className="grid gap-2">
               <Badge
                 variant="secondary"
                 className="w-fit text-muted-foreground"
@@ -168,7 +168,7 @@ export const BuildComponents: RequiredResourceComponents = {
             </Card>
           </HoverCardTrigger>
           <HoverCardContent align="start">
-            <div className="grid">
+            <div className="grid gap-2">
               <Badge
                 variant="secondary"
                 className="w-fit text-muted-foreground"
diff --git a/frontend/src/components/resources/repo/index.tsx b/frontend/src/components/resources/repo/index.tsx
index d847c9aea..093277f6c 100644
--- a/frontend/src/components/resources/repo/index.tsx
+++ b/frontend/src/components/resources/repo/index.tsx
@@ -126,7 +126,7 @@ export const RepoComponents: RequiredResourceComponents = {
             </Card>
           </HoverCardTrigger>
           <HoverCardContent align="start">
-            <div className="grid">
+            <div className="grid gap-2">
               <Badge
                 variant="secondary"
                 className="w-fit text-muted-foreground"
@@ -155,7 +155,7 @@ export const RepoComponents: RequiredResourceComponents = {
             </Card>
           </HoverCardTrigger>
           <HoverCardContent align="start">
-            <div className="grid">
+            <div className="grid gap-2">
               <Badge
                 variant="secondary"
                 className="w-fit text-muted-foreground"
diff --git a/frontend/src/components/resources/stack/index.tsx b/frontend/src/components/resources/stack/index.tsx
index dd12f2d65..41a7cf2f8 100644
--- a/frontend/src/components/resources/stack/index.tsx
+++ b/frontend/src/components/resources/stack/index.tsx
@@ -226,7 +226,7 @@ export const StackComponents: RequiredResourceComponents = {
             </Card>
           </HoverCardTrigger>
           <HoverCardContent align="start">
-            <div className="grid">
+            <div className="grid gap-2">
               <Badge
                 variant="secondary"
                 className="w-fit text-muted-foreground"
@@ -260,7 +260,7 @@ export const StackComponents: RequiredResourceComponents = {
             </Card>
           </HoverCardTrigger>
           <HoverCardContent align="start">
-            <div className="grid">
+            <div className="grid gap-2">
               <Badge
                 variant="secondary"
                 className="w-fit text-muted-foreground"
diff --git a/frontend/src/components/resources/stack/info.tsx b/frontend/src/components/resources/stack/info.tsx
index 09048b5af..3e18763f7 100644
--- a/frontend/src/components/resources/stack/info.tsx
+++ b/frontend/src/components/resources/stack/info.tsx
@@ -20,7 +20,7 @@ export const StackInfo = ({
     <Section titleOther={titleOther}>
       {!is_down && stack?.info?.deployed_contents && (
         <Card>
-          <CardHeader>
+          <CardHeader className="flex flex-col gap-2">
             deployed contents:{" "}
             {stack?.info?.deployed_contents?.map((content, i) => (
               <pre key={i} className="flex flex-col gap-2">
@@ -34,7 +34,7 @@ export const StackInfo = ({
 
       {stack?.config?.file_contents ? (
         <Card>
-          <CardHeader>
+          <CardHeader className="flex flex-col gap-2">
             latest contents:{" "}
             <pre className="flex flex-col gap-2">
               defined in UI:
@@ -46,7 +46,7 @@ export const StackInfo = ({
         stack?.info?.remote_contents &&
         stack?.info?.remote_contents.length > 0 && (
           <Card>
-            <CardHeader>
+            <CardHeader className="flex flex-col gap-2">
               latest contents:{" "}
               {stack?.info?.remote_contents?.map((content, i) => (
                 <pre key={i} className="flex flex-col gap-2">
@@ -60,7 +60,7 @@ export const StackInfo = ({
       )}
       {stack?.info?.remote_errors && stack?.info?.remote_errors.length > 0 && (
         <Card>
-          <CardHeader>
+          <CardHeader className="flex flex-col gap-2">
             remote errors:{" "}
             {stack?.info?.remote_errors?.map((content, i) => (
               <pre key={i} className="flex flex-col gap-2">