diff --git a/public/app/features/canvas/runtime/root.tsx b/public/app/features/canvas/runtime/root.tsx
index 512a4d78a90..1d2f3f40dd0 100644
--- a/public/app/features/canvas/runtime/root.tsx
+++ b/public/app/features/canvas/runtime/root.tsx
@@ -54,6 +54,7 @@ export class RootElement extends FrameState {
         {this.elements.map((v) => (
           <Fragment key={v.UID}>{v.render()}</Fragment>
         ))}
+        {this.scene.connections.render()}
       </div>
     );
   }
diff --git a/public/app/features/canvas/runtime/scene.tsx b/public/app/features/canvas/runtime/scene.tsx
index 7d93f127f58..95bc2f7d54f 100644
--- a/public/app/features/canvas/runtime/scene.tsx
+++ b/public/app/features/canvas/runtime/scene.tsx
@@ -366,7 +366,6 @@ export class Scene {
 
     const sceneDiv = (
       <>
-        {this.connections.render()}
         {this.root.render()}
         {this.isEditingEnabled && (
           <Portal>
diff --git a/public/app/plugins/panel/canvas/components/connections/ConnectionAnchors.tsx b/public/app/plugins/panel/canvas/components/connections/ConnectionAnchors.tsx
index ddf67e154f0..38893b4ce3b 100644
--- a/public/app/plugins/panel/canvas/components/connections/ConnectionAnchors.tsx
+++ b/public/app/plugins/panel/canvas/components/connections/ConnectionAnchors.tsx
@@ -137,7 +137,6 @@ const getStyles = (theme: GrafanaTheme2) => ({
     cursor: 'cursor',
     width: `calc(5px + 2 * ${ANCHOR_PADDING}px)`,
     height: `calc(5px + 2 * ${ANCHOR_PADDING}px)`,
-    zIndex: 100,
   }),
   highlightElement: css({
     backgroundColor: '#00ff00',