Les outils pour les développeurs Chrome rendent le débogage intuitif des mises en page en grille CSS grâce à diverses options de visualisation.
Regardez la vidéo pour découvrir comment activer/désactiver la superposition de grille dans le panneau Éléments et comment:
- Visualisez et inspectez les mises en page en grille.
- Reportez-vous aux numéros de ligne et de colonne lorsque vous placez des éléments de grille.
- Utilisez des noms de lignes et de zones et affichez-les sur la superposition si vous avez beaucoup d'éléments de grille et que les chiffres ne sont pas clairs.
- Vérifiez la taille des pistes.
De plus, avec l'éditeur de grille du volet Éléments > Styles, vous pouvez aligner les éléments et leur contenu sous forme de grille d'un simple clic sur un bouton au lieu de saisir des règles CSS.
Pour une expérience d'apprentissage plus pratique, suivez le tutoriel Inspecter la grille CSS.