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
Arikaturika Tumojenko
8,897 Points"See the wildlife" link sits right on the bottom border of the wildlife div. Why?
Did Guil add any CSS in between the videos? This is the code I have for the wildlife div
.wildlife {
color: white;
background-color: #434a52;
padding: 18% 24%;
border-top: 10px solid #ffa949;
margin: 105px 0 60px 0;
}
and this is the code I have for my callout class
.callout {
font-size: 1.25em;
border-bottom: 3px solid;
padding: 0 9px 3px;
margin-top: 20px;
display: inline-block;
}
Using the same code as in the video, my "see the wildlife" link will sit right on the bottom border of the div, it won't have any bottom margin or padding.
You can see here https://jsbin.com/boluvezeno/edit?html,css,output
What am I missing? Seems to me the link there has some bottom border/ padding applied.
4 Answers
Chris Dillon
Front End Web Development Techdegree Student 4,459 PointsI have this same issue. There was code added between videos which is not very helpful for those who are new to coding and understanding CSS. There really should be some type of note or update so we know what code to add if we're following along.....
If you want to add a CSS style to somewhat copy what is in the video, try the styles below. If you're not sure what that style is targeting--you're selecting the last (:last-child) link (a) of the primary-content class.
.primary-content a:last-child {
margin-bottom: 100px;
}
tomaszfurmanczyk
Full Stack JavaScript Techdegree Student 18,242 PointsThe major issue I have with most of these tutorials is that it doesn't lay out all the steps in sequence. What Treehouse wants you to do is open a fresh workspace for each video. However, if you go through all of the videos a couple of times and try to create pages with HTML/CSS for your own projects you will learn very fast!
Ezra Siton
12,644 Points"why" this is the CSS you create. Add margin-bottom if you dont want the underline of the a tag - to overlap the bottom border of the parent (or add padding-bottom to the parent div)
<a class="callout" href="#wildlife" style="
margin-bottom: 50px;
">See the Wildlife</a>
Arikaturika Tumojenko
8,897 PointsI already know it has a margin/ padding. My question was more about the fact code has been added between videos.
Kat Stacy
41,658 PointsJust go to the next video and open a new session of workspaces. The additional code should be there and it will apply the needed spacing.