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 How to Make a Website Styling Web Pages and Navigation Style the Image Captions

darren1515
darren1515
12,031 Points
Posted by darren1515
darren1515
12,031 Points

Can someone please tell me why the float property applied to the list items in the gallery somehow affects the footer?

I am currently going through the web design track and am on the part where you style the image gallery. Could someone please explain why the float property applied to list items within the gallery also gets applied to both the Facebook and twitter logo in the footer? I know this is rectified by using the clear property but don't understand why this problem occurs in the first place.

Thank you

3 Answers

Marie Veverka
Marie Veverka
12,117 Points
Marie Veverka
Marie Veverka
12,117 Points

Hi Darren,

Treehouse actually has a really great article on their CSS tricks page explaining floats: http://css-tricks.com/almanac/properties/f/float/ I hope it helps!

Isaac Asante
Isaac Asante
4,752 Points
Isaac Asante
Isaac Asante
4,752 Points

This is because naturally, normal content flows around 'floated' elements. So if the footer's images are not commanded to resist floating through clear:both;, they will float around the last floated gallery item.

darren1515
darren1515
12,031 Points
darren1515
darren1515
12,031 Points

Great thanks for the help! much appreciated.