Avete mai applicato il codice CSS a un elemento ma non funziona?
Con Chrome DevTools puoi individuare a colpo d'occhio i problemi CSS, nonché eseguirne il debug e testarli.
Guarda il video per scoprire in che modo il riquadro Elementi > Stili mette in evidenza vari problemi relativi a CSS:
Proprietà con sintassi non valida
Proprietà ignorata
Proprietà non attiva 
Ereditata da
parent
proprietà ereditata
Proprietà non ereditata
Proprietà abbreviata espandibile 
Proprietà longhand sostituita
Proprietà di lunga durata attiva
foglio di stile dello user agent
- Proprietà non modificabile
Proprietà non modificabile sostituita
Altri suggerimenti per il debug:
- Utilizza il filtro nel riquadro Stili per concentrarti sulla proprietà che ti interessa.
- Utilizza il riquadro Calcolato per vedere tutti i vincitori di Cascade e i relativi valori calcolati.
- Nel riquadro Elaborato, espandi una proprietà e fai clic su un link per trovare la relativa origine nel riquadro Stili.
Per scoprire di più su tutti i modi in cui DevTools evidenzia i problemi CSS, consulta l'articolo Trovare CSS, non validi, sottoposti a override, non attivi e altri CSS.
Per migliorare le tue competenze relative a CSS, consulta Imparare a utilizzare CSS.
Per scoprire come creare siti web accattivanti e adatti a tutti, consulta l'articolo Imparare il design reattivo.