Main testpagina

Overzicht van het element in mogelijke structuren om te testen.

Tests

Beschikbare voorbeelden:

Content direct binnen main

Voor visueel voorbeeld zie: Direct

HTML-voorbeeld:

<main>
  <!-- content -->
</main>

Content binnen main gegroepeerd in div's

Voor visueel voorbeeld zie: Div

HTML-voorbeeld:

<main>
  <div>
    <!-- content -->
  </div>
</main>

Content binnen main gegroepeerd in section's

HTML-voorbeeld:

<main>
  <section>
    <!-- content -->
  </section>
</main>

Content binnen main gegroepeerd in article's

HTML-voorbeeld:

<main>
  <article class="visually-grouped">
    <!-- content -->
  </article>
</main>

Content in een content-wrapper binnen main

De content wrapper zorgt ervoor dat de achtergrond door kan lopen terwijl de content een maximale breedte heeft.

Voor visueel voorbeeld zie: Content wrapper div

HTML-voorbeeld:

<main>
  <div> <!-- This can be full width div, section or article -->
    <div> <!-- While the content width can be limited -->
      <!-- content -->
    </div>
  </div>
</main>