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 The Solution

Posted by catrina stewart
catrina stewart
1,300 Points

Box inspector showed different dimensions from mine yet coding was the same

So, i'm a little confused after the practice for the box sizing in the CSS course. I did all the coding correctly (or corrected it if needed during the 'how to' video), with one exception - i added a p {color:white} bc my text wasn't showing up as i'd added colour further up. At the end, when the box is shown in the development tool, my dimensions were different - i was feeling quite happy about it all until then, as now I'm wondering what i'm not getting! Would appreciate any possible explanations. Thank you

Brandon White
.a{fill-rule:evenodd;}techdegree seal-36
Brandon White
Full Stack JavaScript Techdegree Graduate 34,662 Points

Hi catrina stewart,

Is there any chance you could fork your workspace, or provide a link to your repo. It’s difficult to tell why your results may have been different without being able to review your code.

My guess would be that there was a typo somewhere in your css file.

Or perhaps, you didn’t use the box-sizing property. In the intro video Guil hints that he hasn’t gone over that property yet.

https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing

Maybe that info helps. If not, like I said, send a link to your code (or you could even copy/paste it here) and I’m sure that together you and I could get to the bottom of this.

Happy coding.

2 Answers

Mow Larnin
Mow Larnin
4,318 Points
Mow Larnin
Mow Larnin
4,318 Points

I had the same issue when i went to chrome dev tool. However I got it fixed. What you have to do is click on the CSS Panel, there start to uncheck the properties and check them again, this should somehow refresh things and give you the correct figures.