Does the footer element and the header element in the div element become the header and footer of the div element?

I wrote the following code.

<header>page header!</header>
<div class="content">
  <header>content header?</header>
  <footer>content footer?</footer>
</div>
<footer>page footer!</footer>

I read many articles, I know that div elements are meaningless semantically.

If so, where do you belong to the header and footer elements in the div element of the code I wrote?

I am not looking for an alternative to a div element. I want to know if the footer element of the div element functions as the footer of the content in the div element.

Thank you.

Solution

Header and footer elements are related to the nearest ancestor sectioning content element - section, aside, article or nav - or nearest ancestor sectioning root element - blockquote, details, fieldset, td, figure, dialog.

If the header/footer is not a descendent of any of these then it relates to the document as a whole. (the body element is a special case of sectioning root element)

In your example, as div is not a sectioning content or sectioning root, the document as a whole has two headers and two footers.