"Framework Basics" was retired on December 6, 2017. You are now viewing the recommended replacement.

Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS Debugging Styles Solution

Posted by Eric Harrington
Eric Harrington
1,942 Points

Add new class functionality in Chrome Inspector.

I added a debug class (.debug) to the css that is being used on my webpage. When adding it using the .cls add new class functionality it doesn't do anything. Where is the correct location to add a class to use?

1 Answer

Jamie Reardon
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Jamie Reardon
Treehouse Project Reviewer
Jamie Reardon
.a{fill-rule:evenodd;}techdegree seal-36
Jamie Reardon
Treehouse Project Reviewer

Hi Eric Harrington I believe you are referring to this video at around the 2:50 mark. You need to add styles for every class in your CSS as you can see this is what the teacher is doing at this timestamp. Once you have added those, you can add classes as you described through dev tools in order to see the styles applied to the element(s).

Eric Harrington
Eric Harrington
1,942 Points

Thanks Jamie. It may be easier to describe what I hope/expect to happen. My webpage is using a linked CSS file (theme.css). I was hoping to add a new class to this theme.css named debug. In the debug class I would add the border property of red. Then while using Inspect dev tool I would add this class to an element for troubleshooting. This way I can be on any page in my website and quickly add the debug class. I assumed using the .cls feature would allow that, I don't believe that is true and wanted to confirm. Do I need to type this class every time I want to use it?