Onzichtbare fieldset

Visueel onzichtbare fieldset. Waarbij de fieldset toegevoegd is aan de HTML ten behoeve van toegankelijkheid maar niet zichtbaar is.

Benodigde stappen:

  1. Voeg de benodigde bestanden toe aan het project. Voor een overzicht van de benodigde en optionele bestanden zie: Bijbehorende bestanden.

Voorbeelden

Visueel voorbeeld:

Basis

Fieldset test

HTML-voorbeeld:

<form action="" method="post">
  <fieldset>
    <legend>Fieldset test</legend>
    <label for="form-example-base">Voorbeeld text input</label>
    <input
      id="form-example-base"
      name="form-example-base"
      type="text"
    />
    <label for="form-example-base-2">Voorbeeld text input</label>
    <input
      id="form-example-base-2"
      name="form-example-base-2"
      type="text"
    />
  </fieldset>
  <button type="submit">Verzend</button>
</form>

Bijbehorende bestanden

Voor meer informatie over importeren en instellen van componenten. Zie: Componenten gebruiken en styling toevoegen

Importeer component via npm

CSS-voorbeeld:

@use "@minvws/manon/form-base";
@use "@minvws/manon/form-fieldset";

Instelbare variabelen

Bijbehorende elementen: