Environment

• Operating System: Linux
• Node Version: v18.20.3
• Nuxt Version: 3.14.1592
• CLI Version: 3.17.1
• Nitro Version: 2.10.4
• Package Manager: npm@10.2.3
• Builder: -
• User Config: default
• Runtime Modules: -
• Build Modules: -

Reproduction

https://stackblitz.com/edit/github-2xmgnqmb?file=pages%2FAbout.client.vue

Describe the bug

With a layout that depends on CSS flexbox, some client only pages are broken because there seems to be a div element created by either NuxtLayout or NuxtPage possibly that is not a flex element. This ruins the page layout for my application.

The reproduction shows two pages, the index.vue page which fills the whole page, and About.vue which does not fill the whole page.

Additional context

In /about, the additional div is highlighted here in the following image.

While in the home page, you do not see the additional div, instead, the .page element is a direct child of #__nuxt.