Float class for attribution

[Posts in the debugging category need to have the following pieces of information included in order to help other teachers or our moderator team best help you. Feel free to delete everything in brackets before posting your request for debugging help.]

Link to the project or level: [replace with link to the curriculum or get the “Share” link to a project] https://codeprojects.org/projects/weblab/jHGcW1tt43-wRH8BRJLDVH2oBzV1UTu2raaT4lcNiNc
What I expect to happen: attributions below the pictures
What actually happens: attributions above
What I’ve tried: adding breaks

@sherry.wood ,

Hello Sherry!

I just clicked on the link and don’t see any images at all. Were there changes made to the site after you posted this request, maybe?

If you have a different link, we’re happy to look at it.



How about now? thanks

You have to click their links at the top


OK. I found them. I was just looking at the home page.

When you float an image, it lifts off the page and other content just flows around it (basically ignoring it), so if you float an image to the right, the text will see that there is space on the left and it will just take that space.

Floats can be tricky for that reason and more and more, web developers are moving away from using float and they use other ways of laying out their pages such as the CSS Grid system.

This can be a bit over the top for CSD, though. Here’s a link to a recent thread where a few teachers shared some ideas for keeping simple layouts and having text grouped with images in a practical way.

Hopefully one of these links will work for you.


1 Like