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 trialReuven Kishon
5,270 PointsI 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?
3 Answers
Dor Sarel
9,987 PointsHi, 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
5,270 PointsMy 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
8,368 Pointscould 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
5,270 PointsI believe Dor answered my question, but thank you!
Marshall Wells
8,368 PointsMarshall Wells
8,368 PointsYour 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. :)