diff --git a/web/src/views/app/VersionModal.vue b/web/src/views/app/VersionModal.vue
index b9aa9fa1..33be9b02 100644
--- a/web/src/views/app/VersionModal.vue
+++ b/web/src/views/app/VersionModal.vue
@@ -68,6 +68,7 @@ const handleClose = () => {
     :bordered="false"
     :segmented="false"
     @close="handleClose"
+    @mask-click="handleClose"
   >
     <n-form :model="model">
       <n-form-item path="channel" :label="$gettext('Channel')">
diff --git a/web/src/views/cert/CertView.vue b/web/src/views/cert/CertView.vue
index 620b7fbc..12d67c81 100644
--- a/web/src/views/cert/CertView.vue
+++ b/web/src/views/cert/CertView.vue
@@ -568,6 +568,7 @@ onUnmounted(() => {
     :bordered="false"
     :segmented="false"
     @close="handleShowModalClose"
+    @mask-click="handleShowModalClose"
   >
     <n-tabs type="line" animated>
       <n-tab-pane name="cert" :tab="$gettext('Certificate')">
diff --git a/web/src/views/container/ContainerCreate.vue b/web/src/views/container/ContainerCreate.vue
index 70424f60..a06ee22d 100644
--- a/web/src/views/container/ContainerCreate.vue
+++ b/web/src/views/container/ContainerCreate.vue
@@ -132,6 +132,7 @@ onMounted(() => {
     :bordered="false"
     :segmented="false"
     @close="handleClose"
+    @mask-click="handleClose"
   >
     <n-form :model="createModel">
       <n-form-item path="name" :label="$gettext('Container Name')">