diff --git a/x-pack/platform/plugins/shared/index_management/public/application/components/mappings_editor/components/document_fields/common/listItemStyle.ts b/x-pack/platform/plugins/shared/index_management/public/application/components/mappings_editor/components/document_fields/common/listItemStyle.ts
index 20f5f06859b9a..c49dbda7dbc2a 100644
--- a/x-pack/platform/plugins/shared/index_management/public/application/components/mappings_editor/components/document_fields/common/listItemStyle.ts
+++ b/x-pack/platform/plugins/shared/index_management/public/application/components/mappings_editor/components/document_fields/common/listItemStyle.ts
@@ -13,7 +13,7 @@ export const getListItemStyle = ({ border, colors, size }: EuiThemeComputed<{}>)
   `,
   field: css`
     border-bottom: ${border.thin};
-    height: calc(${size.xl} * 2);
+    min-height: calc(${size.xl} * 2);
     margin-top: ${size.xs};
   `,
   fieldEnabled: css`
@@ -37,7 +37,7 @@ export const getListItemStyle = ({ border, colors, size }: EuiThemeComputed<{}>)
     padding-left: ${size.m};
   `,
   content: css`
-    height: calc(${size.xl} * 2);
+    min-height: calc(${size.xl} * 2);
     position: relative;
   `,
   contentIndent: css`
diff --git a/x-pack/platform/plugins/shared/index_management/public/application/components/mappings_editor/components/document_fields/fields/fields_list_item.tsx b/x-pack/platform/plugins/shared/index_management/public/application/components/mappings_editor/components/document_fields/fields/fields_list_item.tsx
index 90d6b2c9c9da4..ac02371722ec9 100644
--- a/x-pack/platform/plugins/shared/index_management/public/application/components/mappings_editor/components/document_fields/fields/fields_list_item.tsx
+++ b/x-pack/platform/plugins/shared/index_management/public/application/components/mappings_editor/components/document_fields/fields/fields_list_item.tsx
@@ -231,6 +231,7 @@ function FieldListItemComponent(
           <EuiFlexGroup
             gutterSize="s"
             alignItems="center"
+            wrap
             css={[
               styles.content,
               !hasChildFields &&
@@ -265,18 +266,22 @@ function FieldListItemComponent(
               </EuiFlexItem>
             )}
 
-            {isMultiField && (
-              <EuiFlexItem grow={false}>
-                <EuiIcon color="subdued" type="documents" />
-              </EuiFlexItem>
-            )}
+            <EuiFlexItem>
+              <EuiFlexGroup gutterSize="s" alignItems="center" wrap={false} responsive={false}>
+                {isMultiField && (
+                  <EuiFlexItem grow={false}>
+                    <EuiIcon color="subdued" type="documents" aria-hidden="true" />
+                  </EuiFlexItem>
+                )}
 
-            <EuiFlexItem
-              grow={false}
-              data-test-subj={`fieldName ${dataTestSubj}-fieldName`}
-              aria-label={i18nTexts.fieldListNameLabel}
-            >
-              {source.name}
+                <EuiFlexItem
+                  grow={false}
+                  data-test-subj={`fieldName ${dataTestSubj}-fieldName`}
+                  aria-label={i18nTexts.fieldListNameLabel}
+                >
+                  {source.name}
+                </EuiFlexItem>
+              </EuiFlexGroup>
             </EuiFlexItem>
 
             <EuiFlexGroup aria-label={i18nTexts.fieldListTypesLabel}>
diff --git a/x-pack/platform/plugins/shared/index_management/public/application/sections/home/index_list/details_page/details_page_mappings_content.tsx b/x-pack/platform/plugins/shared/index_management/public/application/sections/home/index_list/details_page/details_page_mappings_content.tsx
index 5b70590e424bf..2b928dc6083d3 100644
--- a/x-pack/platform/plugins/shared/index_management/public/application/sections/home/index_list/details_page/details_page_mappings_content.tsx
+++ b/x-pack/platform/plugins/shared/index_management/public/application/sections/home/index_list/details_page/details_page_mappings_content.tsx
@@ -370,6 +370,15 @@ export const DetailsPageMappingsContent: FunctionComponent<{
     }
   `;
 
+  const mappingsListPanelStyles = css`
+    min-width: 0;
+    width: 100%;
+    height: 100%;
+    ${useEuiBreakpoint(['m', 'l', 'xl'])} {
+      min-width: 600px;
+    }
+  `;
+
   const saveMappingsButton = (
     <EuiButton
       onClick={() => updateMappings()}
@@ -560,13 +569,7 @@ export const DetailsPageMappingsContent: FunctionComponent<{
             </EuiFlexItem>
           )}
           {hasMappings && (
-            <EuiFlexItem
-              grow={false}
-              css={css`
-                min-width: 600px;
-                height: 100%;
-              `}
-            >
+            <EuiFlexItem grow={false} css={mappingsListPanelStyles}>
               <EuiPanel hasShadow={false} paddingSize="none">
                 {isJSONVisible ? jsonBlock : treeViewBlock}
               </EuiPanel>
diff --git a/x-pack/platform/plugins/shared/index_management/public/application/sections/home/index_list/index_actions_context_menu/index_actions_context_menu.tsx b/x-pack/platform/plugins/shared/index_management/public/application/sections/home/index_list/index_actions_context_menu/index_actions_context_menu.tsx
index c9a6844f20d6a..4a748d0ce7aa8 100644
--- a/x-pack/platform/plugins/shared/index_management/public/application/sections/home/index_list/index_actions_context_menu/index_actions_context_menu.tsx
+++ b/x-pack/platform/plugins/shared/index_management/public/application/sections/home/index_list/index_actions_context_menu/index_actions_context_menu.tsx
@@ -11,7 +11,15 @@ import { FormattedMessage } from '@kbn/i18n-react';
 import { i18n } from '@kbn/i18n';
 import { every } from 'lodash';
 import type { EuiPopoverProps, EuiButtonProps } from '@elastic/eui';
-import { EuiButton, EuiContextMenu, EuiPopover, EuiSpacer, EuiText } from '@elastic/eui';
+import {
+  EuiButton,
+  EuiContextMenu,
+  EuiPopover,
+  EuiSpacer,
+  EuiText,
+  useEuiTheme,
+} from '@elastic/eui';
+import { css } from '@emotion/react';
 
 import type { HttpSetup } from '@kbn/core-http-browser';
 import { flattenPanelTree } from '../../../../lib/flatten_panel_tree';
@@ -80,7 +88,7 @@ export const IndexActionsContextMenu = ({
   indices,
   isOnListView,
   resetSelection,
-  anchorPosition = 'rightUp',
+  anchorPosition,
   iconSide = 'right',
   iconType = 'arrowDown',
   label,
@@ -108,6 +116,21 @@ export const IndexActionsContextMenu = ({
 
   const [isPopoverOpen, setIsPopoverOpen] = useState<boolean>(false);
   const modalRef = useRef<ModalHostHandles | null>(null);
+  const { euiTheme } = useEuiTheme();
+  const computedAnchorPosition: EuiPopoverProps['anchorPosition'] =
+    anchorPosition ?? (isOnListView ? 'downLeft' : 'downRight');
+
+  const popoverStyles = css`
+    overflow-x: hidden;
+    max-height: min(60vh, calc(100vh - ${euiTheme.size.xxxl} - ${euiTheme.size.m}));
+    max-width: calc(100vw - ${euiTheme.size.xl});
+    @supports (height: 100dvh) {
+      max-height: min(60dvh, calc(100dvh - ${euiTheme.size.xxxl} - ${euiTheme.size.m}));
+    }
+    @supports (width: 100dvw) {
+      max-width: calc(100dvw - ${euiTheme.size.xl});
+    }
+  `;
 
   const onButtonClick = () => {
     setIsPopoverOpen((prevState) => !prevState);
@@ -434,8 +457,12 @@ export const IndexActionsContextMenu = ({
         isOpen={isPopoverOpen}
         closePopover={closePopover}
         panelPaddingSize="none"
-        anchorPosition={anchorPosition}
+        anchorPosition={computedAnchorPosition}
         repositionOnScroll
+        repositionToCrossAxis={false}
+        panelProps={{
+          css: popoverStyles,
+        }}
       >
         <EuiContextMenu data-test-subj="indexContextMenu" initialPanelId={0} panels={panels} />
       </EuiPopover>