Content is being rendered even after the end of page

This is my layouts\default.vue
<script setup lang="ts">
  import FooterSection from '~/components/FooterSection.vue';
  import NavSection from '~/components/NavSection.vue';
</script>

<template>
  <div
    class="relative flex min-h-screen flex-col items-stretch justify-between"
  >
    <nav-section class="drop-shadow" />

    <div>
      <slot />
    </div>

    <footer>
      <responsive-section
        class="bg-custom-dark text-custom-light"
      >
        <template #section-content>
          <footer-section />
        </template>
      </responsive-section>
    </footer>
  </div>
</template>


This is my app.vue
<template>
  <nuxt-layout>
    <nuxt-page />
  </nuxt-layout>
  <div>
    Hello
  </div>
</template>

Since the app.vue ends with
<div>
    Hello
  </div>

there should not be any content after it, right?
But there is. Why?
Was this page helpful?