diff --git a/app/client/packages/design-system/widgets/src/components/Flex/src/flexCss.ts b/app/client/packages/design-system/widgets/src/components/Flex/src/flexCss.ts
index d1f81e4d94..c17502d67f 100644
--- a/app/client/packages/design-system/widgets/src/components/Flex/src/flexCss.ts
+++ b/app/client/packages/design-system/widgets/src/components/Flex/src/flexCss.ts
@@ -97,7 +97,7 @@ export const containerDimensionStyles = <T = FlexCssProps[keyof FlexCssProps]>(
       if (current !== "base") {
         return (
           prev +
-          `@container (min-width: ${current}) {& {
+          `@container flex-container (min-width: ${current}) {& {
           ${cssProp}: ${
             //@ts-expect-error: type mismatch
             callback ? callback(value[current], extraProps) : value[current]
diff --git a/app/client/packages/design-system/widgets/src/components/Flex/src/styles.module.css b/app/client/packages/design-system/widgets/src/components/Flex/src/styles.module.css
index 140e79c428..82ff265193 100644
--- a/app/client/packages/design-system/widgets/src/components/Flex/src/styles.module.css
+++ b/app/client/packages/design-system/widgets/src/components/Flex/src/styles.module.css
@@ -1,5 +1,6 @@
 .flexContainer {
   container-type: inline-size;
+  container-name: flex-container;
   display: flex;
   justify-content: center;
   width: 100%;
diff --git a/app/client/src/layoutSystems/anvil/layoutComponents/components/styles.css b/app/client/src/layoutSystems/anvil/layoutComponents/components/styles.css
index 89d39bbec9..b8b8c1ca74 100644
--- a/app/client/src/layoutSystems/anvil/layoutComponents/components/styles.css
+++ b/app/client/src/layoutSystems/anvil/layoutComponents/components/styles.css
@@ -1,3 +1,4 @@
 .make-container {
   container-type: inline-size;
+  container-name: flex-container;
 }