Séparation par fieldset

Attention, à partir de SPIP 3.1, la structure ul/li présentée ici est remplacée par des div pour une meilleure accessibilité. Voyez Structure HTML des formulaires de SPIP.

Lorsqu’un formulaire possède de nombreux champs, on le divise généralement en différents blocs nommés fieldset en HTML. Il est proposé, pour de tels blocs, de les encadrer également dans des listes ul/li :

<form method="post" action="#ENV{action}"><div>
#ACTION_FORMULAIRE{#ENV{action}}
<ul class="editer-groupe">
  <li class="fieldset">
    <fieldset>
      <h3 class="legend">Partie A</h3>
      <ul class="editer-groupe">
        <li class="editer"> ... </li>
        <li class="editer"> ... </li>
        ...
      </ul>
    </fieldset>
  </li>
  <li class="fieldset">
    <fieldset>
      <h3 class="legend">Partie B</h3>
      <ul class="editer-groupe">
        <li class="editer"> ... </li>
        <li class="editer"> ... </li>
        ...
      </ul>
    </fieldset>
  </li>
</ul>
  <p class="boutons"><input type="submit" class="submit" value="<:pass_ok:>" /></p>
</div></form>

Le premier <li> posséde une classe CSS « fieldset ». En lieu et place des balises HTML <legend> est suggéré une écriture <h3 class="legend"> qui offre plus de possibilités de décoration en CSS.

Auteur Matthieu Marcillaud Publié le : Mis à jour : 14/02/19

Traductions : English, Español, français