Why is the default HTML size different between vanilla HTML code and Next.js?

by

For testing purposes, I am running two web servers. One is created using vanilla HTML and run with npm serve, while the other is created using Next.js 13 and run with next dev.

Vanilla HTML

index.html

<html lang="en">
    <body>
    </body>
</html>

Result

enter image description here

Nextjs 13

layout.js

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>{children}</body>
    </html>
  )
}

page.js

export default function Home() {
  return (
    <></>
  )
}

Result

enter image description here

Why is this different?

  • Can you check is there any styles?

    – 

  • no style. delete every style sheet.

    – 

  • what’s the style of the body? might be due to his childs.

    – 

  • 1

    Notice that nextjs has added stuff in the head element. Look at that and tell us what you see. I suspect there will be a meta viewport setting in there.

    – 

Leave a Comment