diff --git a/packages/graphql-playground-react/src/components/Playground/DocExplorer/ColumnDoc.tsx b/packages/graphql-playground-react/src/components/Playground/DocExplorer/ColumnDoc.tsx
index 07f927d20..af03eb2f5 100644
--- a/packages/graphql-playground-react/src/components/Playground/DocExplorer/ColumnDoc.tsx
+++ b/packages/graphql-playground-react/src/components/Playground/DocExplorer/ColumnDoc.tsx
@@ -32,5 +32,6 @@ const Column = styled<ColumnProps, 'div'>('div')`
   flex-flow: column;
   padding-bottom: 20px;
   border-right: 1px solid ${p => p.theme.colours.black10};
-  overflow: ${p => (p.overflow ? 'hidden scroll' : 'auto auto')};
+  overflow-x: ${p => (p.overflow ? 'hidden' : 'auto')}
+  overflow-y: ${p => (p.overflow ? 'scroll' : 'auto')}
 `