diff --git a/src/components/JsonViewer/JsonViewer.tsx b/src/components/JsonViewer/JsonViewer.tsx
index ec0e00a6..f55cd19c 100644
--- a/src/components/JsonViewer/JsonViewer.tsx
+++ b/src/components/JsonViewer/JsonViewer.tsx
@@ -35,14 +35,12 @@ class Json extends React.PureComponent<JsonProps> {
       <JsonViewerWrap>
         <SampleControls>
           {renderCopyButton()}
-          <button
-            onClick={this.expandAll}
-            style={{ display: showFoldingButtons ? 'inline-block' : 'none' }}
-          > Expand all </button>
-          <button
-            onClick={this.collapseAll}
-            style={{ display: showFoldingButtons ? 'inline-block' : 'none' }}
-          > Collapse all </button>
+          {showFoldingButtons &&
+            <>
+              <button onClick={this.expandAll}> Expand all </button>
+              <button onClick={this.collapseAll}> Collapse all </button>
+            </>
+          }
         </SampleControls>
         <OptionsContext.Consumer>
           {(options) => (
diff --git a/src/components/__tests__/JsonViewer.tsx b/src/components/__tests__/JsonViewer.tsx
index e82c8f82..35b5d179 100644
--- a/src/components/__tests__/JsonViewer.tsx
+++ b/src/components/__tests__/JsonViewer.tsx
@@ -47,11 +47,8 @@ describe('Components', () => {
       const flatData = { a: 1, b: '2', c: null };
       const flatDataComponent = mount(withTheme(<JsonViewer data={flatData} />));
 
-      const expandButton = flatDataComponent.find('div > button[children=" Expand all "]');
-      expect(expandButton.html()).toContain('display: none');
-
-      const collapseButton = flatDataComponent.find('div > button[children=" Collapse all "]');
-      expect(collapseButton.html()).toContain('display: none');
+      expect(flatDataComponent.html()).not.toContain('Expand all');
+      expect(flatDataComponent.html()).not.toContain('Collapse all');
     });
   });
 });