Browser Border - Removal | Next.js | Page 1

tame rain Jun 30, 2023, 3:41 PM

#

So I'm having issues with a border on my browser, it works fine on the default 'localhost:3000/', but when I go to a different route there ends up being a white border which I can't seem to get rid of.

Screenshot_2023-06-30_at_11.39.44_AM.png

buoyant hedgeBOT Jun 30, 2023, 3:41 PM

#

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)

tame rain Jun 30, 2023, 3:42 PM

#

theres both my relevant files.

Screenshot_2023-06-30_at_11.39.49_AM.png

viscid hinge Jun 30, 2023, 3:52 PM

#

Just add margin: 0; to your root element

#

I do this on the <body> of my RootLayout component

tame rain Jun 30, 2023, 3:53 PM

#

i have that in global.css @viscid hinge

Screenshot_2023-06-30_at_11.53.24_AM.png

viscid hinge Jun 30, 2023, 4:01 PM

#

If you go to one of the pages with the border and inspect the CSS on <body> does it confirm that it has the margin: 0; attribute?

tame rain Jun 30, 2023, 4:04 PM

#

yep found it, says 8px

#

how would i modify that then ?

viscid hinge Jun 30, 2023, 4:07 PM

#

In the inspector tool you should be able to see where the 8px margin is being inherited from and track back. Alternatively, you could probably get by with putting !important after the margin: 0 attribute in your global.css file. This way is a little hacky and the !important attribute is generally considered bad practice but it's a quick fix for the short-term

tame rain Jun 30, 2023, 4:13 PM

#

fixed it ty!, for some reasosn important didnt work, so I just found out I could do npm normalize and that worked.

viscid hinge Jun 30, 2023, 4:18 PM

#

Nice! Glad you got it fixed. You should mark your last post as the answer for this post so others can see it's been solved if they're searching for a similar problem

#Browser Border - Removal