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 Portfolio

Reuven Kishon
Reuven Kishon
5,270 Points

I don't understand how the caption text below the gallery images, stays below the image when setting float = left...

I would think that the caption text would be to the right of the image. Care to help explain this to me?

Marshall Wells
Marshall Wells
8,368 Points

Your question was cut off - let me see if I understand - you're trying to put the caption above the image? You could try this css...

caption { caption-side: top; }

or explain your question for me. :)

3 Answers

Dor Sarel
Dor Sarel
9,987 Points

Hi, as i can see from the video - the <li> element contains the link, img and p elements inside it. they are his children. so when you apply the property float: left to the <li>, it also applied to his children.

Reuven Kishon
Reuven Kishon
5,270 Points

Marshall Wells,

My question was why the caption text stays below the image, when you set the float attribute to left, within the #gallery li selector. I would think that the captions would go to the right of the images.

Marshall Wells
Marshall Wells
8,368 Points

could you post your code? I think the trouble is when you're applying a float-left to the #gallery li you're applying the float to the image not the caption - I believe the image/caption is a parent/child relationship, so unless you change the caption's attributes it's going to remain under the image, it's position relative to it's parent, the image.

Try setting the caption-side attribute with my previous css and see if that solves your problem.

Reuven Kishon
Reuven Kishon
5,270 Points

I believe Dor answered my question, but thank you!