Is it semantically correct to use a <p> inside my <header>-CodePudding

I already have a h1 tag somewhere else in the page, now I've just made a form and I added a header and footer tag to the form to make everything semantically, now I'm wondering if I can put a p inside my header instead of an h1, h2, h3 for example

<form>
  <header>Try it free 7 days then $20/mo. thereafter</header>

  <input type="text" name="fname" id="fname" placeholder="First name" />
  <input ... />
  <input ... />
  <button type="submit">Claim your free trial</button>

  <footer>
    By clicking the button, you are agreeing to our Terms and Services
  </footer>
</form>

CodePudding user response：

The MDN page for the <header> element states that Flow content (except for a descendent <header> or <footer> element) is semantically allowed within the content of <header>, which would necessarily include the <p> element.

This is consistent with the Content model spec defined in the HTML standard for <header>.

CodePudding user response：

As has been pointed out, a <p> inside <header> is allowed. Semantically, it only makes sense if we are talking about something actually paragraph-shaped, i. e. an introduction.

If it's a short fragment, an actual (sub-)headline, you may want to look into splitting your document into several <section>s, each of which can have its own <h1>.

CodePudding user response：

actually no , because of CEO In other words you can use the following convenient elements inside of a header tag in HTML5: a, em, strong, code, cite, span, br, img. See the full list here. The W3C validator will give you the following error if you will try to validate this markup.