Why does my Nuxt/Tailwindcss app have a 12 pixel white bar at the top, above <html>?

119 Views Asked by At

I'm working on a blog using Nuxt 3, Nuxt-content, and Tailwind-css. I just set the background color in my app.vue and noticed there's a 12-pixel white bar above my content. The weird thing is, looking in Chrome dev tools, the entire <body> element is shifted down by 12 pixels! The <html> element starts at y=0, and I've never seen anything like that.

I don't think I've got any strange :before CSS but since I'm using tailwindcss, it could be anywhere.

It's a whole app, so I can't paste it here, but I made a Stackblitz so you can see it: https://stackblitz.com/edit/node-zgbqga?file=README.md (It should do yarn install && yarn dev when you load it up.)

Can anyone help point me in the right direction?

0

There are 0 best solutions below