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

Posted by AUTIF KAMAL
AUTIF KAMAL
11,692 Points

Stopping footer from merging with content in CSS Layout Challenge.

https://gist.github.com/kautif/646f4a999cfec1cd106e9cb0def43a5d

The above link goes to my index.html and style.css.

The only changes I made in the CSS was making the .primary-col and .secondary-col independent columns. But, I noticed that when I reduce the width of the browser, it blends the footer and background with the columns. Is there a way to stop that? If you know, please share. Thanks.

1 Answer

Ravi Yadav
Ravi Yadav
10,152 Points

Hi Autif. You have floated the two containers. The footer collapses when you resize because you haven't cleared the footer. Clear:both in footer css will prevent them from collapsing. Always make sure stuff around floated elements are well cleared.

AUTIF KAMAL
AUTIF KAMAL
11,692 Points

Oh ok. Thanks, Ravi.