diff --git a/public/src/admin/extend/widgets.js b/public/src/admin/extend/widgets.js
index e3f43f4185..62865097ce 100644
--- a/public/src/admin/extend/widgets.js
+++ b/public/src/admin/extend/widgets.js
@@ -66,10 +66,14 @@ define('admin/extend/widgets', [
 				appendToggle(ui.item);
 			},
 			start: function () {
-				draftContainer.find('[data-location="drafts"]>div').removeClass('overflow-auto');
+				draftContainer.find('[data-location="drafts"]>div')
+					.removeClass('overflow-auto')
+					.css({ 'max-height': 'initial' });
 			},
 			stop: function () {
-				draftContainer.find('[data-location="drafts"]>div').addClass('overflow-auto');
+				draftContainer.find('[data-location="drafts"]>div')
+					.addClass('overflow-auto')
+					.css({ 'max-height': 'calc(100vh - 200px)' });
 			},
 			connectWith: 'div',
 		}).on('click', '.delete-widget', function () {
diff --git a/src/views/admin/extend/widgets.tpl b/src/views/admin/extend/widgets.tpl
index cd926f41fb..c75f12cfad 100644
--- a/src/views/admin/extend/widgets.tpl
+++ b/src/views/admin/extend/widgets.tpl
@@ -28,7 +28,7 @@
 						{{{ each templates.areas }}}
 							<div class="area" data-template="{templates.template}" data-location="{./location}">
 								<h5>{./name} <span class="fs-6 text-secondary">{templates.template} / {./location}</span></h5>
-								<div class="card card-body text-bg-light widget-area overflow-auto" {{{ if (./location == "drafts")}}}style="max-height: calc(100vh - 200px);"{{{ end }}}>
+								<div class="card card-body text-bg-light widget-area {{{ if (./location == "drafts")}}} overflow-auto{{{ end }}}" {{{ if (./location == "drafts")}}}style="max-height: calc(100vh - 200px);"{{{ end }}}>
 
 								</div>
 							</div>