diff --git a/packages/grafana-ui/src/components/Table/Table.tsx b/packages/grafana-ui/src/components/Table/Table.tsx
index 03d2586920f..ef8b83530ff 100644
--- a/packages/grafana-ui/src/components/Table/Table.tsx
+++ b/packages/grafana-ui/src/components/Table/Table.tsx
@@ -34,6 +34,7 @@ import {
 } from './utils';
 
 const COLUMN_MIN_WIDTH = 150;
+const FOOTER_ROW_HEIGHT = 36;
 
 export const Table = memo((props: Props) => {
   const {
@@ -63,7 +64,7 @@ export const Table = memo((props: Props) => {
   const [footerItems, setFooterItems] = useState<FooterItem[] | undefined>(footerValues);
 
   const footerHeight = useMemo(() => {
-    const EXTENDED_ROW_HEIGHT = headerHeight;
+    const EXTENDED_ROW_HEIGHT = FOOTER_ROW_HEIGHT;
     let length = 0;
 
     if (!footerItems) {
@@ -81,7 +82,7 @@ export const Table = memo((props: Props) => {
     }
 
     return EXTENDED_ROW_HEIGHT;
-  }, [footerItems, headerHeight]);
+  }, [footerItems]);
 
   // React table data array. This data acts just like a dummy array to let react-table know how many rows exist
   // The cells use the field to look up values