diff --git a/src/components/CollectionDialog.js b/src/components/CollectionDialog.js
index 07064e832e..4fd15b564c 100644
--- a/src/components/CollectionDialog.js
+++ b/src/components/CollectionDialog.js
@@ -124,19 +124,10 @@ export class CollectionDialog extends Component {
   placeholder() {
     return (
       <Dialog
-        sx={{
-          position: 'absolute !important',
-        }}
+        variant="contained"
         onClose={this.hideDialog}
         open
         container={this.dialogContainer()}
-        slotProps={{
-          backdrop: {
-            sx: {
-              position: 'absolute !important',
-            },
-          },
-        }}
       >
         <DialogTitle id="select-collection">
           <Skeleton variant="text" />
@@ -186,16 +177,9 @@ export class CollectionDialog extends Component {
 
     return (
       <Dialog
-        sx={{ position: 'absolute !important' }}
+        variant="contained"
         onClose={this.hideDialog}
         container={this.dialogContainer()}
-        slotProps={{
-          backdrop: {
-            sx: {
-              position: 'absolute !important',
-            },
-          },
-        }}
         open
       >
         <DialogTitle id="select-collection">
diff --git a/src/config/settings.js b/src/config/settings.js
index fbdb72d896..eb6248b02b 100644
--- a/src/config/settings.js
+++ b/src/config/settings.js
@@ -208,6 +208,19 @@ export default {
           disableTouchRipple: true,
         },
       },
+      MuiDialog: {
+        variants: [
+          {
+            props: { variant: 'contained' },
+            style: {
+              position: 'absolute',
+              '& .MuiBackdrop-root': {
+                position: 'absolute'
+              }
+            },
+          }
+        ]
+      },
       MuiLink: {
         defaultProps: {
           underline: 'always'