diff --git a/src/components/LoginPage.vue b/src/components/LoginPage.vue
index 72c111c2..cc5d838f 100644
--- a/src/components/LoginPage.vue
+++ b/src/components/LoginPage.vue
@@ -25,10 +25,10 @@
                     @keyup.enter="login"
                 />
             </div>
-            <div>
+            <div class="flex justify-center">
                 <a v-t="'titles.login'" class="btn w-auto" @click="login" />
+                <TooltipIcon icon="i-fa6-solid:circle-info" :tooltip="$t('info.login_note')" />
             </div>
-            <TooltipIcon icon="i-fa6-solid:circle-info" :tooltip="$t('info.login_note')" />
         </form>
     </div>
 </template>
diff --git a/src/components/RegisterPage.vue b/src/components/RegisterPage.vue
index 89dce364..1df64d33 100644
--- a/src/components/RegisterPage.vue
+++ b/src/components/RegisterPage.vue
@@ -42,10 +42,10 @@
                     <div class="i-fa6-solid:eye" />
                 </button>
             </div>
-            <div>
+            <div class="flex justify-center">
                 <a v-t="'titles.register'" class="btn w-auto" @click="register" />
+                <TooltipIcon icon="i-fa6-solid:circle-info" :tooltip="$t('info.register_note')" />
             </div>
-            <TooltipIcon icon="i-fa6-solid:circle-info" :tooltip="$t('info.register_note')" />
         </form>
     </div>
     <ConfirmModal
diff --git a/src/components/TooltipIcon.vue b/src/components/TooltipIcon.vue
index a227377f..6973cc04 100644
--- a/src/components/TooltipIcon.vue
+++ b/src/components/TooltipIcon.vue
@@ -1,5 +1,5 @@
 <template>
-    <div id="container" class="w-full">
+    <div id="container" class="m-2 self-center">
         <div :class="icon" class="cursor-pointer"></div>
         <p id="tooltip" class="absolute mr-[20vw] mt-2 hidden rounded-l bg-gray-800 px-2 py-1 text-gray-200">
             {{ tooltip }}