diff --git a/packages/client/src/components/global/MkPageHeader.vue b/packages/client/src/components/global/MkPageHeader.vue
index 28db62c11..9e8e24301 100644
--- a/packages/client/src/components/global/MkPageHeader.vue
+++ b/packages/client/src/components/global/MkPageHeader.vue
@@ -153,12 +153,14 @@ onMounted(() => {
 				// offsetWidth や offsetLeft は少数を丸めてしまうため getBoundingClientRect を使う必要がある
 				// https://developer.mozilla.org/ja/docs/Web/API/HTMLElement/offsetWidth#%E5%80%A4
 				function transition() {
-					const parentRect = tabsEl.getBoundingClientRect();
-					const rect = tabEl.getBoundingClientRect();
-					const left = (rect.left - parentRect.left + tabsEl?.scrollLeft);
-					tabHighlightEl.style.width = rect.width + 'px';
-					tabHighlightEl.style.left = left + 'px';
-					tabsEl?.scrollTo({left: left - 80, behavior: "smooth"});
+					window.requestAnimationFrame(() => {
+						const parentRect = tabsEl.getBoundingClientRect();
+						const rect = tabEl.getBoundingClientRect();
+						const left = (rect.left - parentRect.left + tabsEl?.scrollLeft);
+						tabHighlightEl.style.width = rect.width + 'px';
+						tabHighlightEl.style.left = left + 'px';
+						tabsEl?.scrollTo({left: left - 80, behavior: "smooth"});
+					})
 					tabEl.removeEventListener("transitionend", transition);
 				}
 				tabEl.addEventListener("transitionend", transition);