I am encountering an issue in my Next.js app where, when navigating to the Sign In page via a link (<Link href="/signin">
), the page initially appears smaller or resized (around 90% of the size). However, when I refresh the page or navigate directly to the Sign In page (http://localhost:3000/signin), it renders with the correct size.
The issue only occurs when navigating to the Sign In page via client-side navigation.
Refreshing the page or using a direct URL resolves the issue, and the page displays correctly at 100%.
Environment:
- Next.js version: ^13.4.19
- tailwindcss version: 3.3.3
Sign In Page:
<div className="flex min-h-screen items-center justify-center bg-gray-100 p-4">
<div className="relative w-full max-w-md rounded-xl bg-white p-8 shadow-xl">
{/* Sign In Form */}
</div>
</div>
Home page Navbar Link:
<Link href="/signin">
Sign In
</Link>
What I’ve Tried:
h-screen
and min-h-screen
both didn’t solve the issue.
the problem I have a style on my Navbar.css:
html {
font-size: 10px;
scroll-behavior: smooth;
}
发布者:admin,转转请注明出处:http://www.yc00.com/questions/1745090877a4610686.html
评论列表(0条)