diff --git a/ui/packages/consul-ui/app/components/topology-metrics/index.hbs b/ui/packages/consul-ui/app/components/topology-metrics/index.hbs
index da71d33323..ad1d63e92a 100644
--- a/ui/packages/consul-ui/app/components/topology-metrics/index.hbs
+++ b/ui/packages/consul-ui/app/components/topology-metrics/index.hbs
@@ -20,7 +20,7 @@
   </div>
 {{/if}}
   <div id="metrics-container">
-    <div>
+    <div class="metrics-header">
       {{@service.Service.Service}}
     </div>
     {{#if this.hasMetricsProvider }}
diff --git a/ui/packages/consul-ui/app/components/topology-metrics/index.js b/ui/packages/consul-ui/app/components/topology-metrics/index.js
index a1e5445dfa..d5ebb79e44 100644
--- a/ui/packages/consul-ui/app/components/topology-metrics/index.js
+++ b/ui/packages/consul-ui/app/components/topology-metrics/index.js
@@ -24,7 +24,7 @@ export default class TopologyMetrics extends Component {
     const order = ['allow', 'deny'];
     const dest = {
       x: this.centerDimensions.x,
-      y: this.centerDimensions.y + this.centerDimensions.height / 4,
+      y: this.centerDimensions.y + this.centerDimensions.height / 2,
     };
 
     return items
@@ -51,7 +51,7 @@ export default class TopologyMetrics extends Component {
     const order = ['allow', 'deny'];
     const src = {
       x: this.centerDimensions.x + 20,
-      y: this.centerDimensions.y + this.centerDimensions.height / 4,
+      y: this.centerDimensions.y + this.centerDimensions.height / 2,
     };
 
     return items
@@ -83,7 +83,7 @@ export default class TopologyMetrics extends Component {
 
     // Get Card elements positions
     const downCards = [...document.querySelectorAll('#downstream-container .card')];
-    const grafanaCard = document.querySelector('#metrics-container');
+    const grafanaCard = document.querySelector('.metrics-header');
     const upCards = [...document.querySelectorAll('#upstream-column .card')];
 
     // Set center positioning points
diff --git a/ui/packages/consul-ui/app/components/topology-metrics/layout.scss b/ui/packages/consul-ui/app/components/topology-metrics/layout.scss
index 341712754f..771201b721 100644
--- a/ui/packages/consul-ui/app/components/topology-metrics/layout.scss
+++ b/ui/packages/consul-ui/app/components/topology-metrics/layout.scss
@@ -14,12 +14,10 @@
 #downstream-lines {
   grid-row: 1 / 3;
   grid-column: 2 / 5;
-  pointer-events: none;
 }
 #upstream-lines {
   grid-row: 1 / 3;
   grid-column: 6 / 9;
-  pointer-events: none;
 }
 #upstream-column {
   grid-row: 1 / 3;
diff --git a/ui/packages/consul-ui/app/components/topology-metrics/series/layout.scss b/ui/packages/consul-ui/app/components/topology-metrics/series/layout.scss
index 036b002df4..f79dc4df6c 100644
--- a/ui/packages/consul-ui/app/components/topology-metrics/series/layout.scss
+++ b/ui/packages/consul-ui/app/components/topology-metrics/series/layout.scss
@@ -4,6 +4,7 @@
   padding: 0;
   margin: 0;
   height: 70px;
+  z-index: 2;
 
   svg.sparkline {
     width: 100%;