Utilisez des valeurs explicites, contrôlez chaque ligne générée et gardez un document source cohérent avant le placement visuel.
Partez du besoin de dimensionnement
Une piste fr partage l’espace restant, px réserve une taille fixe, auto suit la taille intrinsèque et minmax(minimum px, maximum fr) conserve un seuil contrôlable tout en partageant l’espace libre. GridWeave sérialise exactement ces quatre profils et refuse les valeurs hors limites. Utilisez fr pour les proportions flexibles, auto pour les lignes guidées par le contenu et minmax lorsqu’une colonne flexible exige un minimum. Testez les pixels avec zoom et traductions.
Comptez les pistes explicites
Chaque contrôle correspond à une entrée explicite de grid-template-columns ou grid-template-rows. Une nouvelle ligne ou colonne reçoit 1fr ; la réduction est refusée si elle coupe une zone existante. Le modèle ne déplace donc rien silencieusement. Après copie, contrôlez la liste dans le code et ajoutez les adaptations par requêtes média ou conteneur selon le besoin réel.
Vérifiez l’ordre réel du document
GridWeave prévisualise la grille visuelle validée, pas le sens ni l’ordre de lecture. Gardez le HTML source dans une séquence logique fonctionnant avant le CSS, puis testez clavier, zoom, traductions longues, faibles largeurs et technologies d’assistance dans le vrai composant. Ajoutez volontairement les points de rupture dans votre feuille : les pistes générées décrivent uniquement la disposition actuelle. La capsule ne garde rien, conservez donc CSS et HTML sous gestion de versions.