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

HTML How to Make a Website Styling Web Pages and Navigation Style the Image Captions

Marco van der Woude
Marco van der Woude
915 Points
Posted by Marco van der Woude
Marco van der Woude
915 Points

Why does floating the #gallery effect the footer?

Just out of curiosity, if you select the #gallery in your css and you tell it to float, why does the same thing happen to the footer? In the html its not inside the gallery id so in my opinion it should not be effected.

Julian Gutierrez
Julian Gutierrez
19,201 Points
Julian Gutierrez
Julian Gutierrez
19,201 Points

Can you post your code or a snapshot of your workspace?

1 Answer

james south
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
james south
Front End Web Development Techdegree Graduate 33,271 Points
james south
.a{fill-rule:evenodd;}techdegree seal-36
james south
Front End Web Development Techdegree Graduate 33,271 Points

that is how floats work - they take the floated elements out of the normal flow of the page, so elements below the floated items, like footers, will act like the floated elements are not there, because the floated elements' container has collapsed. to fix you have to clear the floats:

.container-of-floated-elements:after{ content: ""; display: block; (table is another possible value here) clear: both; } this will restore the height of the container so that other elements, like the footer, respect the space the floated elements occupy.