diff --git a/docs/src/pages/components/autocomplete/ComboBox.js b/docs/src/pages/components/autocomplete/ComboBox.js
index e1737ba03e4c70..cf89dd9220ad04 100644
--- a/docs/src/pages/components/autocomplete/ComboBox.js
+++ b/docs/src/pages/components/autocomplete/ComboBox.js
@@ -5,15 +5,17 @@ import Autocomplete from '@material-ui/core/Autocomplete';
 
 export default function ComboBox() {
   return (
-    <Autocomplete
-      disablePortal
-      id="combo-box-demo"
-      options={top100Films}
-      style={{ width: 300 }}
-      renderInput={(params) => (
-        <TextField {...params} label="Movie" variant="outlined" />
-      )}
-    />
+    <div>
+      <Autocomplete
+        disablePortal
+        id="combo-box-demo"
+        options={top100Films}
+        style={{ width: 300 }}
+        renderInput={(params) => (
+          <TextField {...params} label="Movie" variant="outlined" />
+        )}
+      />
+    </div>
   );
 }
 
diff --git a/docs/src/pages/components/autocomplete/ComboBox.tsx b/docs/src/pages/components/autocomplete/ComboBox.tsx
index e1737ba03e4c70..cf89dd9220ad04 100644
--- a/docs/src/pages/components/autocomplete/ComboBox.tsx
+++ b/docs/src/pages/components/autocomplete/ComboBox.tsx
@@ -5,15 +5,17 @@ import Autocomplete from '@material-ui/core/Autocomplete';
 
 export default function ComboBox() {
   return (
-    <Autocomplete
-      disablePortal
-      id="combo-box-demo"
-      options={top100Films}
-      style={{ width: 300 }}
-      renderInput={(params) => (
-        <TextField {...params} label="Movie" variant="outlined" />
-      )}
-    />
+    <div>
+      <Autocomplete
+        disablePortal
+        id="combo-box-demo"
+        options={top100Films}
+        style={{ width: 300 }}
+        renderInput={(params) => (
+          <TextField {...params} label="Movie" variant="outlined" />
+        )}
+      />
+    </div>
   );
 }