#Error page stopped growing into the rest of the screen.

20 messages · Page 1 of 1 (latest)

jade perch
#

Hello, yesterday I posted about an issue I had related to my error pages introducing a scrollbar because Id like for it to take the entire screen height while take into consideration the fact that theres a navbar. So essentially the rest of the screen space left by the navbar. I was advised to do the following:

<html lang="en">
    <body className={inter.className}>
        <ThemeProvider
            attribute="class"
            defaultTheme="system"
            enableSystem
            disableTransitionOnChange
        >
            <div className="flex flex-col min-h-dvh">
                <Header />
                {children}
            </div>
        </ThemeProvider>

    </body>
</html>

Essentially wrap my main content in a "flex min-h-dvh" In my layout.tsx, and

<div className="grid grow  place-content-center bg-white px-4" >

put "grow" In my error page. Which worked. However today when I run my project I saw that the same issue persisted when I never changed the code at all. Any ideas ?

still kelpBOT
#
Post created!

🔎 This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

🕵️ Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

✅ You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

thorn wedge
jade perch
#

Same

#

Makes no sense, yesterday this code produced the result I wanted. Today, without having touched it it does not

thorn wedge
#

Its haunted then probably. Maybe try stopping the server and restarting and clearing cache and stuff

#

Also check devtools to see if something else is making it overflow

jade perch
#

Meh nothing

#

And I have no idea how to debug this

thorn wedge
jade perch
#

yea theres no errors or anything

thorn wedge
#

Yeah obviously no errors. Im just saying check the layout to see whats overflowing the layout.

#

Using dev tools

jade perch
#

Nothing its just the error page trying to be screen height but since theres the navbar its gets pushed down so it goes over the screen. Theres no other element. Just the navbar and the error page

thorn wedge
#

Did you try that "flex-1" instead of the grid grow tho?

jade perch
#

yep

#

nothing changed

thorn wedge
#

I dont know what's causing this then lol.

Is it maybe something to do with the content of the div itself?

#

Try removing that padding too just in case, and playing around with the content inside div.