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
armand Rodriguez
7,830 PointsQuestion about how floats used in "How to make a website" lesson
So I totally understand how floats are being used here, how the clear works, i just have one question from the lesson previous to this in the "How to make a website" section. In that section, the instructor floated the header—for reasons I'm not entirely sure of— and then for #gallery ,which is right above the footer, he cleared the footer just using footer { clear: both; }. In that case, was he just not concerned with the height of the gallery collapsing? Is there a reason he just didn't use the method shown in this video?
2 Answers
john larson
16,594 PointsI don't have a real thorough explanation of why, and I wondered the same thing as you. I think it's because nick was just showing the super basics. Sometime it seems like just using
footer {
clear:both
}
works just fine. Sometimes it doesn't. Maybe it has to do with the complexity or makeup of the layout. Maybe someone else can give you a more insightful answer.
Jamie Reardon
Treehouse Project ReviewerI wondered the same thing, but I think it's because Nick is using a transparent footer that is blended in with the body color. There is not even a border style defined like in this course's webpage. Nick used the padding-top property to give some space between the body's content above the footer, which he could since it's the same color background and it can be looked at like a margin. Therefore, since margin's collapse, in this course there is other declarations in the css rule like display: table to stop the margin-collapse. Nick didn't need that and probably used a fast basic method since his footer has no border or different background-color.
Hope I explained this alright and that you understand, this is what I made out of it when watching both courses and creating my own projects with two different types of footers. Thanks!