Définition Simple : 

Les “Blocs” sont en réalité des groupes préformatés en terme de tailles pour devenir des colonnes.

Définition Avancée : 

Explication

• Éléments purement visuels qui organisent les champs en colonnes sur une même ligne :
  
  
  
  • Deux colonnes (50/50)
    
    
  • Deux colonnes, 1 tiers / 2 tiers (33/67)
    
    
  • Deux colonnes, 2 tiers / 1 tiers (67/33)
    
    
  • Trois colonnes (33/33/33)
    
    
  • Quatre colonnes (25/25/25/25)
    
    
• Ne stockent rien ; servent uniquement à la mise en page. Le contenu reste les champs que vous y placez.
• Par défaut, le label des colonnes est désactivé, vous pouvez toutefois l’activer et ainsi “nommer” vos colonnes.
  
  

Cas d’usage

• Gagner de la lisibilité en alignant des champs courts sur une même ligne.
  
  
• Mettre en valeur un champ principal (large) avec un champ annexe (étroit), ex. Adresse (large) + Code postal (étroit).
  
  
• Créer des tableaux visuels de petits attributs (codes, tags, indicateurs).
  
  

Exemples d’utilisation

• Deux colonnes (50/50) : Identité à gauche (Nom, Prénom), Contacts à droite (Email, Téléphone).
• Deux colonnes 1/3–2/3 : Code article (court) + Désignation (longue).
• Deux colonnes 2/3–1/3 : Adresse (longue) + Code Postal (court).
• Trois colonnes : CP / Ville / Pays – ou Longueur / Largeur / Hauteur.
• Quatre colonnes : Statut / Priorité / Équipe / Couleur (petits champs de type Liste/Booléen/Couleur).
  
  

Propriétés avancées / Particularités

• Responsive : sur mobile, les colonnes se superposent (ordre de lecture = de gauche à droite, puis de haut en bas).
  
  
• Ergonomie : éviter de placer un champ très long (texte long, gros commentaire) dans une colonne étroite.
  
  
• Cohérence visuelle : alignez des champs de même nature et évitez de mélanger des labels très longs avec des très courts sur la même ligne.
  
  
• Accessibilité : conservez un contraste et une taille de champ suffisants ; ne descendez pas en dessous de ~280–320 px utiles par colonne sur desktop.
  
  Dimensions : La largeur en pourcentage permet de définir la taille de votre colonne, par exemple, si vous souhaitez avoir trois colonnes, optez pour 33%.