diff --git a/packages/grafana-ui/src/components/Table/ExpandedRow.tsx b/packages/grafana-ui/src/components/Table/ExpandedRow.tsx
index a7e8f56f767..44e7b2cf292 100644
--- a/packages/grafana-ui/src/components/Table/ExpandedRow.tsx
+++ b/packages/grafana-ui/src/components/Table/ExpandedRow.tsx
@@ -36,6 +36,8 @@ export function ExpandedRow({ tableStyles, nestedData, rowIndex, width, cellHeig
       paddingLeft: EXPANDER_WIDTH,
       position: 'absolute',
       top,
+      backgroundColor: theme.colors.background.primary,
+      color: theme.colors.text.primary,
     };
 
     top += height + theme.spacing.gridSize;
diff --git a/packages/grafana-ui/src/components/Table/RowsList.tsx b/packages/grafana-ui/src/components/Table/RowsList.tsx
index 39479e91874..76ffe7770d4 100644
--- a/packages/grafana-ui/src/components/Table/RowsList.tsx
+++ b/packages/grafana-ui/src/components/Table/RowsList.tsx
@@ -286,6 +286,7 @@ export const RowsList = (props: RowsListProps) => {
         const { bgColor, textColor } = rowBg(row.index);
         style.background = bgColor;
         style.color = textColor;
+        style.borderLeft = `2px solid ${bgColor}`;
       }
 
       // If there's a text wrapping field we set the height of it here