diff --git a/src/components/GameCard.tsx b/src/components/GameCard.tsx
index b5dcba1..1371e4d 100644
--- a/src/components/GameCard.tsx
+++ b/src/components/GameCard.tsx
@@ -11,7 +11,7 @@ interface Props {
 
 const GameCard = ({ game }: Props) => {
   return (
-    <Card width='300px' borderRadius={10} overflow='hidden'>
+    <Card>
       <Image src={getCroppedImageUrl(game.background_image)} />
       <CardBody>
         <Heading fontSize='2xl'>{game.name}</Heading>
diff --git a/src/components/GameCardContainer.tsx b/src/components/GameCardContainer.tsx
new file mode 100644
index 0000000..3b81837
--- /dev/null
+++ b/src/components/GameCardContainer.tsx
@@ -0,0 +1,16 @@
+import { Box } from "@chakra-ui/react";
+import { ReactNode } from "react";
+
+interface Props {
+  children: ReactNode;
+}
+
+const GameCardContainer = ({ children }: Props) => {
+  return (
+    <Box width="300px" borderRadius={10} overflow="hidden">
+      {children}
+    </Box>
+  );
+};
+
+export default GameCardContainer;
diff --git a/src/components/GameCardSkeleton.tsx b/src/components/GameCardSkeleton.tsx
index e99b7ba..c8d9cbd 100644
--- a/src/components/GameCardSkeleton.tsx
+++ b/src/components/GameCardSkeleton.tsx
@@ -2,7 +2,7 @@ import { Card, CardBody, Skeleton, SkeletonText } from '@chakra-ui/react'
 
 const GameCardSkeleton = () => {
   return (
-    <Card width='300px' borderRadius={10} overflow='hidden'>
+    <Card>
       <Skeleton height="200px" />
       <CardBody>
         <SkeletonText />
diff --git a/src/components/GameGrid.tsx b/src/components/GameGrid.tsx
index 59141d2..594fce7 100644
--- a/src/components/GameGrid.tsx
+++ b/src/components/GameGrid.tsx
@@ -1,6 +1,7 @@
 import { SimpleGrid, Text } from "@chakra-ui/react";
 import useGames from "../hooks/useGames";
 import GameCard from "./GameCard";
+import GameCardContainer from "./GameCardContainer";
 import GameCardSkeleton from "./GameCardSkeleton";
 
 const GameGrid = () => {
@@ -16,9 +17,15 @@ const GameGrid = () => {
         spacing={10}
       >
         {isLoading &&
-          skeletons.map((skeleton) => <GameCardSkeleton key={skeleton} />)}
+          skeletons.map((skeleton) => (
+            <GameCardContainer>
+              <GameCardSkeleton key={skeleton} />
+            </GameCardContainer>
+          ))}
         {games.map((game) => (
-          <GameCard key={game.id} game={game} />
+          <GameCardContainer>
+            <GameCard key={game.id} game={game} />
+          </GameCardContainer>
         ))}
       </SimpleGrid>
     </>