Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
- Introduction to Chrome DevTools 2:11
- Getting to Know the Elements Panel 4:32
- Inspecting Styles 5:26
- Viewing Inherited and User Agent Styles 3:58
- Adding and Editing Styles 2:31
- Identify and Debug Errors 4:28
- Visualizing the Box Model and Computed styles 3:59
- Debugging Styles Challenge 2:05
- Debugging Styles Solution 5:55
Well done!
You have completed Debugging CSS with Chrome DevTools!

- 2x 2x
- 1.75x 1.75x
- 1.5x 1.5x
- 1.25x 1.25x
- 1.1x 1.1x
- 1x 1x
- 0.75x 0.75x
- 0.5x 0.5x
The "Styles" pane also displays which properties are being inherited by (or passed down to) the selected element, as well as properties applied by the browser's default stylesheet (User Agent stylesheet).
Resources
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up-
Danica Louwe
3,423 PointsHello, what does it mean by the faded/greyed out properties in user agent style sheets. Thanks
Posted by Danica LouweDanica Louwe
3,423 Points1 Answer
-
Julianna Kahn
20,702 Points1 Answer
View all discussions for this video
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up