Les outils pour les développeurs Chrome rendent le débogage des mises en page flexibles CSS intuitives. Le panneau Elements (Éléments) fournit un éditeur Flexbox contextuel et une superposition personnalisable.
Regardez la vidéo pour découvrir comment:
- Utilisez l'éditeur Flexbox pour modifier les propriétés Flexbox d'un simple clic sur un bouton au lieu de les saisir.
- Activez ou désactivez la superposition Flexbox dans la fenêtre d'affichage pour voir immédiatement les modifications apportées.
- Accédez à la section Éléments > Mise en page > Flexbox pour afficher la liste de tous les éléments et les localiser dans l'arborescence DOM. Vous pouvez également personnaliser les couleurs de la superposition.
Pour en savoir plus sur CSS en général, accédez à Découvrir CSS > Flexbox.
Pour approfondir le débogage dans les outils de développement, suivez le tutoriel Inspecter et déboguer les mises en page CSS Flexbox.