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
Martel Gaines
1,957 PointsWhy is my arrow in the main header not appearing when adding 150px margin-top to the arrow class in the style sheet?
Guil showed us how to space the arrow in the main header by adding 150px margin-top property value to the arrow class, however, my arrow has disappeared in the header.
It's possible because I have too much linear gradient that has expanded from the main header. When I adjust the margin-top to 75px, I can see the arrow slightly spaced from the header. Is it because I'm on Chrome or my linear gradient needs to be adjusted as well?
/* Main Styles --------------------- */
.main-header { padding-top: 170px; height: 450px;
background: linear-gradient(#ffa949, transparent 90%), linear-gradient(0deg, #fff, transparent), #ffa949 url('../img/mountains.jpg') no-repeat center;
background-size: cover;
.arrow { width: 50px; margin-top: 150px; }
James Fulkerson
4,474 PointsNot sure! I don't see how the linear gradient could affect that, as it's just the background. Your header definitely seems like enough height.
Martel Gaines
1,957 PointsIt may be my browser window, but I thought the font-face property values should of addressed that situation. Anyway, I added more height from 450px to 750px and the spacing of the arrow from the main header is showing up as expected.
Thanks for replying!
James Fulkerson
4,474 PointsNo problem! Glad you got it working!
1 Answer
James Fulkerson
4,474 PointsIt looks like your style declarations for your .main-header element don't have a closing curly brace.
Martel Gaines
1,957 PointsMartel Gaines
1,957 PointsIt has it Jay, I forgot to copy it over in my initial question.