Use of Main, Container, Header and Sections

Callng HTML Semantic Gurus…

So I want to find the best structure of my app in terms of Main, Container, Header and Sections.

As I understand it reading around on the internet:

Container - a BS4 div which the whole page’s content should be wrapped in. Should only be one per page.
Main - to contain the main content of the page, and exclude navigation and repeated items.
Section - a section of content, so to be within Main.
Header - the first part of a page (so including the nav etc) or first part of a Section (so including h1 tag for example)

So I would expect my page structure to be:

container
  header with row/col
  main
    section1 with header, row/col
    section2 with header, row/col

However, Wappler won’t let me put a Main inside a Container.

Am I missing something here? Or shall I just let go of the idea of using a Main?

Best wishes,
Antony.

Community Page
Last updated: