diff --git a/public/app/features/dashboard/containers/DashboardPage.tsx b/public/app/features/dashboard/containers/DashboardPage.tsx
index 3320cd423cf..1a2c42a5f45 100644
--- a/public/app/features/dashboard/containers/DashboardPage.tsx
+++ b/public/app/features/dashboard/containers/DashboardPage.tsx
@@ -299,9 +299,17 @@ export class UnthemedDashboardPage extends PureComponent<Props, State> {
       return;
     }
 
+    // Move all panels down by the height of the "add panel" widget.
+    // This is to work around an issue with react-grid-layout that can mess up the layout
+    // in certain configurations. (See https://github.com/react-grid-layout/react-grid-layout/issues/1787)
+    const addPanelWidgetHeight = 8;
+    for (const panel of dashboard.panelIterator()) {
+      panel.gridPos.y += addPanelWidgetHeight;
+    }
+
     dashboard.addPanel({
       type: 'add-panel',
-      gridPos: { x: 0, y: 0, w: 12, h: 8 },
+      gridPos: { x: 0, y: 0, w: 12, h: addPanelWidgetHeight },
       title: 'Panel Title',
     });