Add fill-available property

elastic · Mar 20, 2023 · 1abd74e · 1abd74e
1 parent d3fec9d
commit 1abd74e
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/...plugins/security_solution/public/detections/components/rules/description_step/helpers.tsx b/...plugins/security_solution/public/detections/components/rules/description_step/helpers.tsx
@@ -100,14 +100,14 @@ export const buildQueryBarDescription = ({
         description: (
           <EuiFlexGroup wrap responsive={false} gutterSize="xs">
             {filterManager.getFilters().map((filter, index) => (
-              <EuiFlexItem grow={false} key={`${field}-filter-${index}`}>
+              <EuiFlexItem
+                grow={false}
+                key={`${field}-filter-${index}`}
+                css={{ width: 'fill-available' }}
+              >
                 <EuiBadgeWrap color="hollow">
                   {indexPatterns != null ? (
-                    <FilterBadgeGroup
-                      css={{ maxWidth: '100%' }}
-                      filters={[filter]}
-                      dataViews={[indexPatterns]}
-                    />
+                    <FilterBadgeGroup filters={[filter]} dataViews={[indexPatterns]} />
                   ) : (
                     <EuiLoadingSpinner size="m" />
                   )}