diff --git a/js/src/database/events.js b/js/src/database/events.js
index 3256af1ba5..c421ab108d 100644
--- a/js/src/database/events.js
+++ b/js/src/database/events.js
@@ -295,7 +295,7 @@ const DatabaseEvents = {
                     classes: {
                         'ui-dialog-titlebar-close': 'btn-close'
                     },
-                    width: 700,
+                    width: '70%',
                     minWidth: 500,
                     buttons: buttonOptions,
                     // Issue #15810 - use button titles for modals (eg: new procedure)
diff --git a/js/src/database/routines.js b/js/src/database/routines.js
index 443d7fbc73..a28faeca9f 100644
--- a/js/src/database/routines.js
+++ b/js/src/database/routines.js
@@ -308,8 +308,7 @@ const DatabaseRoutines = {
                     classes: {
                         'ui-dialog-titlebar-close': 'btn-close'
                     },
-                    height: 400,
-                    width: 700,
+                    width: '70%',
                     minWidth: 500,
                     buttons: buttonOptions,
                     // Issue #15810 - use button titles for modals (eg: new procedure)
diff --git a/js/src/database/triggers.js b/js/src/database/triggers.js
index 3421bfebcc..075fc3ccc1 100644
--- a/js/src/database/triggers.js
+++ b/js/src/database/triggers.js
@@ -300,7 +300,7 @@ const DatabaseTriggers = {
                     classes: {
                         'ui-dialog-titlebar-close': 'btn-close'
                     },
-                    width: 700,
+                    width: '70%',
                     minWidth: 500,
                     buttons: buttonOptions,
                     // Issue #15810 - use button titles for modals (eg: new procedure)