diff --git a/public/assets/components/modal.css b/public/assets/components/modal.css
index b546cd5b..769f2ac2 100644
--- a/public/assets/components/modal.css
+++ b/public/assets/components/modal.css
@@ -6,6 +6,7 @@
     right: 0;
     background: #f2f3f5f0;
     z-index: 1000;
+    display: flex;
 }
 .component_modal > div{
     box-shadow: 1px 2px 20px rgba(0, 0, 0, 0.1);
@@ -14,6 +15,7 @@
     max-width: 320px;
     padding: 20px 20px 0 20px;
     border-radius: 2px;
+    margin: auto;
 }
 
 .dark-mode .component_modal{
diff --git a/public/assets/components/modal.js b/public/assets/components/modal.js
index 626402e5..a6c4ed67 100644
--- a/public/assets/components/modal.js
+++ b/public/assets/components/modal.js
@@ -113,27 +113,6 @@ class ModalComponent extends HTMLElement {
             })),
         ));
 
-        // feature: center horizontally
-        effect(rxjs.merge(
-            rxjs.fromEvent(window, "resize"),
-            rxjs.of(null),
-        ).pipe(
-            rxjs.distinct(() => document.body.offsetHeight),
-            rxjs.map(() => {
-                let size = targetHeight;
-                if (size === null) {
-                    const $box = document.querySelector("#modal-box > div");
-                    if ($box instanceof HTMLElement) size = $box.offsetHeight;
-                }
-                size = Math.round((document.body.offsetHeight - size) / 2);
-                if (size < 0) return 0;
-                if (size > 250) return 250;
-                return size;
-            }),
-            rxjs.map((size) => ["margin", `${size}px auto 0 auto`]),
-            applyMutation(qs(this, ".component_modal > div"), "style", "setProperty"),
-        ));
-
         return (id) => close$.next(id);
     }
 }