Address bar is overflowing in mobile resolution
Unanswered
Spectacled bear posted this in #help-forum
Spectacled bearOP
Hi, i've a next app which is overflowing the address bar in mobile screen. Im not using h-[100vh] in my project neither h-screen. Any idea how to fix this?
This is how my layout file looks like
This is how my layout file looks like
import "./globals.css";>
import AppProvider from "./provider";
export const metadata = {
title: "Cvee - Online Resume",
description:
"Create a professional online cvee with ease. Transform your traditional resume into a sleek, mobile-friendly website to showcase your skills and achievements. Stand out to employers today!",
};
export default function RootLayout({
children,
}: {
children: React.ReactNode;
}) {
return (
<html lang="en">
<body className="h-dvh">
<AppProvider>{children}</AppProvider>
</body>
</html>
);
}
11 Replies
Layout won't help with this issue. It would be a good idea to share your
page.(jsx|tsx). Its also worth inspecting to see whats wrongCan you inspect the webpage and try to find out which element is overflowing?
@Anay-208 Can you inspect the webpage and try to find out which element is overflowing?
Spectacled bearOP
the screen has 2 components and they are overflowing that is not a issue, issue is my address bar is getting hidden while scrolling. I want it to be fixed on top
Umm can you attach a screenshot?
Spectacled bearOP
In this pic address bar is visible
If you see here the address bar is scrolled and not showing rn.
Umm, Address bar is handled by the app. so if its not visible, thats not a bug with the website I believe?
does this happen on other websites?
@Spectacled bear I'm requesting updates on this issue