diff --git a/src/components/header.tsx b/src/components/header.tsx
index c2251b9..3893f5f 100644
--- a/src/components/header.tsx
+++ b/src/components/header.tsx
@@ -23,9 +23,15 @@ export function Header({
 					{title || "YeloBit"}
 				</h1>
 			</div>
-			<div className={"w-1/3 flex flex-row justify-center items-center"}>{children}</div>
 			<div
-				className={"w-1/3 flex flex-row justify-center md:justify-end gap-2 items-center"}
+				className={"w-1/3 flex flex-col md:flex-row w-full justify-center items-center"}
+			>
+				{children}
+			</div>
+			<div
+				className={
+					"w-1/3 flex flex-row justify-center md:justify-end w-full md:w-fit gap-2 items-center"
+				}
 			>
 				<AccountDialog />
 				<ThemeBtnSelector />