diff --git a/src/plugins/management/public/components/feature_cards/__snapshots__/feature_cards.test.tsx.snap b/src/plugins/management/public/components/feature_cards/__snapshots__/feature_cards.test.tsx.snap
index e5f9a1975d83..59d957733871 100644
--- a/src/plugins/management/public/components/feature_cards/__snapshots__/feature_cards.test.tsx.snap
+++ b/src/plugins/management/public/components/feature_cards/__snapshots__/feature_cards.test.tsx.snap
@@ -11,15 +11,15 @@ exports[`<FeatureCards /> render with complex navLinks 1`] = `
         class="euiSpacer euiSpacer--m"
       />
       <div
-        class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive"
-        data-test-subj="landingPageRow_0"
+        class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive euiFlexGroup--wrap"
       >
         <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
+          class="euiFlexItem euiFlexItem--flexGrowZero"
         >
           <div
             class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPanel--isClickable euiCard euiCard--leftAligned euiCard--isClickable"
             data-test-subj="landingPageFeature_1"
+            style="width: 200px;"
           >
             <div
               class="euiCard__content"
@@ -47,11 +47,12 @@ exports[`<FeatureCards /> render with complex navLinks 1`] = `
           </div>
         </div>
         <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
+          class="euiFlexItem euiFlexItem--flexGrowZero"
         >
           <div
             class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPanel--isClickable euiCard euiCard--leftAligned euiCard--isClickable"
             data-test-subj="landingPageFeature_2"
+            style="width: 200px;"
           >
             <div
               class="euiCard__content"
@@ -79,11 +80,12 @@ exports[`<FeatureCards /> render with complex navLinks 1`] = `
           </div>
         </div>
         <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
+          class="euiFlexItem euiFlexItem--flexGrowZero"
         >
           <div
             class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPanel--isClickable euiCard euiCard--leftAligned euiCard--isClickable"
             data-test-subj="landingPageFeature_3"
+            style="width: 200px;"
           >
             <div
               class="euiCard__content"
@@ -111,11 +113,12 @@ exports[`<FeatureCards /> render with complex navLinks 1`] = `
           </div>
         </div>
         <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
+          class="euiFlexItem euiFlexItem--flexGrowZero"
         >
           <div
             class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPanel--isClickable euiCard euiCard--leftAligned euiCard--isClickable"
             data-test-subj="landingPageFeature_4"
+            style="width: 200px;"
           >
             <div
               class="euiCard__content"
@@ -142,17 +145,13 @@ exports[`<FeatureCards /> render with complex navLinks 1`] = `
             </div>
           </div>
         </div>
-      </div>
-      <div
-        class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive"
-        data-test-subj="landingPageRow_1"
-      >
         <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
+          class="euiFlexItem euiFlexItem--flexGrowZero"
         >
           <div
             class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPanel--isClickable euiCard euiCard--leftAligned euiCard--isClickable"
             data-test-subj="landingPageFeature_5"
+            style="width: 200px;"
           >
             <div
               class="euiCard__content"
@@ -179,15 +178,6 @@ exports[`<FeatureCards /> render with complex navLinks 1`] = `
             </div>
           </div>
         </div>
-        <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
-        />
-        <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
-        />
-        <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
-        />
       </div>
       <div
         class="euiSpacer euiSpacer--l"
@@ -203,15 +193,15 @@ exports[`<FeatureCards /> render with complex navLinks 1`] = `
         class="euiSpacer euiSpacer--m"
       />
       <div
-        class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive"
-        data-test-subj="landingPageRow_0"
+        class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive euiFlexGroup--wrap"
       >
         <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
+          class="euiFlexItem euiFlexItem--flexGrowZero"
         >
           <div
             class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPanel--isClickable euiCard euiCard--leftAligned euiCard--isClickable"
             data-test-subj="landingPageFeature_category-1"
+            style="width: 200px;"
           >
             <div
               class="euiCard__content"
@@ -239,11 +229,12 @@ exports[`<FeatureCards /> render with complex navLinks 1`] = `
           </div>
         </div>
         <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
+          class="euiFlexItem euiFlexItem--flexGrowZero"
         >
           <div
             class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPanel--isClickable euiCard euiCard--leftAligned euiCard--isClickable"
             data-test-subj="landingPageFeature_category-2"
+            style="width: 200px;"
           >
             <div
               class="euiCard__content"
@@ -271,11 +262,12 @@ exports[`<FeatureCards /> render with complex navLinks 1`] = `
           </div>
         </div>
         <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
+          class="euiFlexItem euiFlexItem--flexGrowZero"
         >
           <div
             class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPanel--isClickable euiCard euiCard--leftAligned euiCard--isClickable"
             data-test-subj="landingPageFeature_category-3"
+            style="width: 200px;"
           >
             <div
               class="euiCard__content"
@@ -303,11 +295,12 @@ exports[`<FeatureCards /> render with complex navLinks 1`] = `
           </div>
         </div>
         <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
+          class="euiFlexItem euiFlexItem--flexGrowZero"
         >
           <div
             class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPanel--isClickable euiCard euiCard--leftAligned euiCard--isClickable"
             data-test-subj="landingPageFeature_category-4"
+            style="width: 200px;"
           >
             <div
               class="euiCard__content"
@@ -334,17 +327,13 @@ exports[`<FeatureCards /> render with complex navLinks 1`] = `
             </div>
           </div>
         </div>
-      </div>
-      <div
-        class="euiFlexGroup euiFlexGroup--gutterLarge euiFlexGroup--directionRow euiFlexGroup--responsive"
-        data-test-subj="landingPageRow_1"
-      >
         <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
+          class="euiFlexItem euiFlexItem--flexGrowZero"
         >
           <div
             class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPanel--hasShadow euiPanel--isClickable euiCard euiCard--leftAligned euiCard--isClickable"
             data-test-subj="landingPageFeature_category-5"
+            style="width: 200px;"
           >
             <div
               class="euiCard__content"
@@ -371,15 +360,6 @@ exports[`<FeatureCards /> render with complex navLinks 1`] = `
             </div>
           </div>
         </div>
-        <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
-        />
-        <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
-        />
-        <div
-          class="euiFlexItem euiFlexItem--flexGrow1"
-        />
       </div>
       <div
         class="euiSpacer euiSpacer--l"
diff --git a/src/plugins/management/public/components/feature_cards/feature_cards.test.tsx b/src/plugins/management/public/components/feature_cards/feature_cards.test.tsx
index 95d1ba5a64f3..108db8c98861 100644
--- a/src/plugins/management/public/components/feature_cards/feature_cards.test.tsx
+++ b/src/plugins/management/public/components/feature_cards/feature_cards.test.tsx
@@ -103,7 +103,7 @@ describe('<FeatureCards />', () => {
   });
 
   it('render with complex navLinks', () => {
-    const { container, getAllByTestId } = render(
+    const { container } = render(
       <FeatureCards
         pageDescription=""
         navLinks={navLinks}
@@ -113,7 +113,6 @@ describe('<FeatureCards />', () => {
       />
     );
     expect(container).toMatchSnapshot();
-    expect(getAllByTestId('landingPageRow_1').length).toEqual(2);
   });
 
   it('click item', () => {
diff --git a/src/plugins/management/public/components/feature_cards/feature_cards.tsx b/src/plugins/management/public/components/feature_cards/feature_cards.tsx
index 73a0e300dacb..2d2a3756654f 100644
--- a/src/plugins/management/public/components/feature_cards/feature_cards.tsx
+++ b/src/plugins/management/public/components/feature_cards/feature_cards.tsx
@@ -30,26 +30,20 @@ export const FeatureCards = ({
   pageDescription,
   navigationUI: { HeaderControl },
 }: FeatureCardsProps) => {
-  const itemsPerRow = 4;
   const groupedCardForDisplay = useMemo(() => {
-    const grouped: Array<{ category?: AppCategory; navLinks: ChromeNavLink[][] }> = [];
+    const grouped: Array<{ category?: AppCategory; navLinks: ChromeNavLink[] }> = [];
     // The navLinks has already been sorted based on link / category's order,
     // so it is safe to group the links here.
     navLinks.forEach((link) => {
       let lastGroup = grouped.length ? grouped[grouped.length - 1] : undefined;
-      if (!lastGroup || lastGroup.category !== link.category) {
-        lastGroup = { category: link.category, navLinks: [[]] };
+      if (!lastGroup || lastGroup.category?.id !== link.category?.id) {
+        lastGroup = { category: link.category, navLinks: [] };
         grouped.push(lastGroup);
       }
-      const lastRow = lastGroup.navLinks[lastGroup.navLinks.length - 1];
-      if (lastRow.length < itemsPerRow) {
-        lastRow.push(link);
-      } else {
-        lastGroup.navLinks.push([link]);
-      }
+      lastGroup.navLinks.push(link);
     });
     return grouped;
-  }, [itemsPerRow, navLinks]);
+  }, [navLinks]);
   if (!navLinks.length) {
     return null;
   }
@@ -72,30 +66,23 @@ export const FeatureCards = ({
               </EuiTitle>
             )}
             <EuiSpacer size="m" />
-            {group.navLinks.map((row, rowIndex) => {
-              return (
-                <EuiFlexGroup data-test-subj={`landingPageRow_${rowIndex}`} key={rowIndex}>
-                  {Array.from({ length: itemsPerRow }).map((item, itemIndexInRow) => {
-                    const link = row[itemIndexInRow];
-                    const content = link ? (
-                      <EuiCard
-                        data-test-subj={`landingPageFeature_${link.id}`}
-                        textAlign="left"
-                        title={link.title}
-                        description={link.description || link.title}
-                        onClick={() => navigateToApp(link.id)}
-                        titleSize="xs"
-                      />
-                    ) : null;
-                    return (
-                      <EuiFlexItem key={link?.id || itemIndexInRow} grow={1}>
-                        {content}
-                      </EuiFlexItem>
-                    );
-                  })}
-                </EuiFlexGroup>
-              );
-            })}
+            <EuiFlexGroup wrap>
+              {group.navLinks.map((link, index) => {
+                return (
+                  <EuiFlexItem key={link?.id || index} grow={false}>
+                    <EuiCard
+                      data-test-subj={`landingPageFeature_${link.id}`}
+                      textAlign="left"
+                      title={link.title}
+                      description={link.description || link.title}
+                      onClick={() => navigateToApp(link.id)}
+                      titleSize="xs"
+                      style={{ width: 200 }}
+                    />
+                  </EuiFlexItem>
+                );
+              })}
+            </EuiFlexGroup>
             <EuiSpacer />
           </div>
         ))}