diff --git a/x-pack/legacy/plugins/infra/public/components/metrics_explorer/chart.tsx b/x-pack/legacy/plugins/infra/public/components/metrics_explorer/chart.tsx
index 6c61cbcf68cd4e..3fb755aa6957c6 100644
--- a/x-pack/legacy/plugins/infra/public/components/metrics_explorer/chart.tsx
+++ b/x-pack/legacy/plugins/infra/public/components/metrics_explorer/chart.tsx
@@ -85,7 +85,7 @@ export const MetricsExplorerChart = ({
         <EuiTitle size="xs">
           <EuiFlexGroup alignItems="center">
             <ChartTitle>
-              <EuiToolTip content={title}>
+              <EuiToolTip content={title} anchorClassName="metricsExplorerTitleAnchor">
                 <span>{title}</span>
               </EuiToolTip>
             </ChartTitle>
@@ -158,7 +158,7 @@ export const MetricsExplorerChart = ({
 };
 
 const ChartTitle = euiStyled.div`
-  width: 100%
+  width: 100%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
diff --git a/x-pack/legacy/plugins/infra/public/index.scss b/x-pack/legacy/plugins/infra/public/index.scss
index 4cef6d6baa9155..afee4ab8b03897 100644
--- a/x-pack/legacy/plugins/infra/public/index.scss
+++ b/x-pack/legacy/plugins/infra/public/index.scss
@@ -36,6 +36,12 @@
 
 .infrastructureChart .echTooltip__label {
   overflow-x: hidden;
-  white-space: no-wrap;
+  white-space: nowrap;
   text-overflow: ellipsis;
 }
+
+.metricsExplorerTitleAnchor {
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  display: inline;
+}