diff --git a/packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker/TimePickerContent.tsx b/packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker/TimePickerContent.tsx
index 7a842518430..d7245a9bbcd 100644
--- a/packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker/TimePickerContent.tsx
+++ b/packages/grafana-ui/src/components/DateTimePickers/TimeRangePicker/TimePickerContent.tsx
@@ -280,6 +280,8 @@ const getStyles = (
     borderRadius: theme.shape.radius.default,
     border: `1px solid ${theme.colors.border.weak}`,
     [`${isReversed ? 'left' : 'right'}`]: 0,
+    display: 'flex',
+    flexDirection: 'column',
   }),
   body: css({
     display: 'flex',
@@ -292,7 +294,7 @@ const getStyles = (
     flexDirection: 'column',
     borderRight: `${isReversed ? 'none' : `1px solid ${theme.colors.border.weak}`}`,
     width: `${!hideQuickRanges ? '60%' : '100%'}`,
-    overflow: 'hidden',
+    overflow: 'auto',
     order: isReversed ? 1 : 0,
   }),
   rightSide: css({