Chargez le préréglage centré. Il crée un élément en row avec justify-content: center et align-items: center. La première règle centre sur l’axe principal, la seconde sur l’axe transversal. L’élément garde flex: 0 1 auto et sa taille de contenu.

Le centrage exige de l’espace transversal

L’aperçu a une hauteur minimale rendant le centrage transversal visible. Un vrai conteneur limité à son contenu n’a aucun espace vertical à partager. Ajoutez une taille ou min-height seulement si le design l’exige ; FlexWeave ne copie pas la hauteur d’aperçu dans le CSS.

Règles attendues

Le conteneur contient display flex, row, nowrap, les deux centrages et des espaces de 16px. L’élément utilise flex: 0 1 auto, align-self: auto et order: 0. Le HTML contient Item 1 une fois dans l’ordre source.

Vérifiez le vrai composant

FlexWeave rend le modèle visuel validé avec le navigateur courant, mais ignore votre contenu, mode d’écriture, contrôles focalisables et largeurs prises en charge. Intégrez les règles au composant, gardez un ordre HTML cohérent et testez faible largeur, zoom, traductions longues, clavier et technologies d’assistance. Direction inversée et order ne prouvent jamais une bonne séquence de lecture. Conservez CSS et HTML sous gestion de versions, car la capsule ne garde aucun projet.