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 CSS Basics (2014) Enhancing the Design With CSS Transparent Gradients and Multiple Backgrounds

Teacher Russell
Teacher Russell
16,873 Points

developer tools shows a border at the bottom of the header

Does anyone know why google dev tools shows a border bottom line when you use gradients to make a header just like the one in this course. I've used it several times, and it always looks great on hand held devices, but shows this border bottom when you look at it on laptops. Not sure if that shows in real life, or just on the dev tools. Thank you!

same question here... I looked into the developer tool, and thought the "border" is from the .primary-content? but still not sure why it happened. I noticed it also appeared in Guil's video at the end.

2 Answers

Guys, this is an actual border-top declaration. If you go to the first div in the HTML you will see two classes, one is primary -content and the other is the t-border, the latter declares a top border of 2 pixels. So in conclusion, it is not an effect from the linear-gradient.

Teacher Russell
Teacher Russell
16,873 Points

I didn't remember that showing up in the video. Ok, thanks! Good to know.