diff --git a/core/misc/dialog/off-canvas.es6.js b/core/misc/dialog/off-canvas.es6.js
index df2c98e065..584b34fe21 100644
--- a/core/misc/dialog/off-canvas.es6.js
+++ b/core/misc/dialog/off-canvas.es6.js
@@ -78,10 +78,14 @@
       };
 
       /**
-       * Applies initial height to dialog based on window height.
+       * Applies initial height and with to dialog based depending on position.
        * @see http://api.jqueryui.com/dialog for all dialog options.
        */
-      settings.height = $(window).height();
+      const position = settings.drupalOffCanvasPosition;
+      const height = position === 'side' ? $(window).height() : '300px';
+      const width = position === 'side' ? settings.width : '100%';
+      settings.height = height;
+      settings.width = width;
     },
 
     /**
diff --git a/core/misc/dialog/off-canvas.js b/core/misc/dialog/off-canvas.js
index abd54a645a..86bd47a9fc 100644
--- a/core/misc/dialog/off-canvas.js
+++ b/core/misc/dialog/off-canvas.js
@@ -35,7 +35,11 @@
         of: window
       };
 
-      settings.height = $(window).height();
+      var position = settings.drupalOffCanvasPosition;
+      var height = position === 'side' ? $(window).height() : '300px';
+      var width = position === 'side' ? settings.width : '100%';
+      settings.height = height;
+      settings.width = width;
     },
     beforeClose: function beforeClose(_ref2) {
       var $element = _ref2.$element;