Вы когда-нибудь применяли CSS к элементу, но он просто не работал?
С помощью Chrome DevTools вы можете сразу обнаружить проблемы CSS, отладить и протестировать их.
Посмотрите видео, чтобы узнать, как на панели «Элементы» > «Стили» выявляются различные проблемы CSS:
Свойство с неверным синтаксисом
Переопределенное свойство
Неактивное свойство 
Унаследовано от
parent
Унаследованное имущество-
Ненаследственное имущество
Расширяемое сокращенное свойство 
-
Переопределенное длинное свойство -
Активная собственность от руки
-
таблица стилей пользовательского агента
- Нередактируемое свойство
-
Переопределенное нередактируемое свойство
Дополнительные советы по отладке:
- Используйте фильтр на панели «Стили» , чтобы сосредоточиться на одном свойстве, которое вас интересует.
- Используйте панель «Вычисляемые» , чтобы просмотреть всех победителей каскада и их вычисленные значения.
- На панели «Вычисляемые» разверните свойство и щелкните ссылку, чтобы найти его источник на панели «Стили» .
Чтобы узнать больше обо всех способах, которыми DevTools выявляет проблемы CSS, см. раздел Поиск недействительных, переопределенных, неактивных и других CSS .
Чтобы повысить свой уровень знаний CSS, см. раздел «Изучение CSS» .
Чтобы узнать, как создавать веб-сайты, которые отлично выглядят и хорошо работают для всех, см. раздел «Изучение адаптивного дизайна» .