U2:L11, module 13

Hi Gang,
So this is my second year teaching CS Discoveries. I’m on Unit 2: Lesson 11. I’m writing CSS on my style sheet but the changes aren’t appearing after saving. The program seems to be ignoring the code altogether.
For some reason it is only NOT working in regards to my images. I want them to be centered…that’s all. When I look at the style sheet “img” is in pink/red, and all the other elements appear in blue and are working.


My Website Example

Any way you could share your page and send us a URL to look at? If not, a larger screenshot of both the html and the css could also help. Sometimes, a missing semi-colon, curly bracket or other “syntax” typo is the culprit.

Thanks,

Mike

You can look right into it. Any help is appreciated.

Student: Redacted

Code: Redacted

password: Redacted

Look at lines 23-26. There is a missing curly bracket–the closing } to designate the end of the h3 selector.

If you add a closing } at the end of line 27 or on line 28, that will fix your images.

I will delete the login information in your previous post to prevent others from using it.

Mike

Thank you so much, but now my text is wrapping around the image. How do I prevent that from happening?

That is caused by the float:right; rule in your css img rules.

Float will “lift” the image off the page and cause other elements to behave differently as a result.

One option would be to delete the float rule, however, if you do want the image on the right side of the page, it will be a little more complicated to handle because the Creative Commons logo is also an image, so you will have to style them separately by using classes.

This does start to go a little beyond the scope of the html taught in unit 2. I could recommend using W3Schools (website) as a reference guide. I would probably create a new section called <footer> where I would put my creative commons logo and then I could style images only in the body with the float:right; and then, you may have to use what is called “clearfix” css rules to help the text flow around the images. (https://www.w3schools.com/howto/howto_css_clearfix.asp)

This may be more work than you want to go to, but that’s the rough outline of how to get there.

Mike

I was able to fix that, but no matter what code I put in…I can’t get the images to go to the center.

I was able to center images last year…https://codeprojects.org/jean5dv4BSgi4NFlHgJDco8QdDpFqnmK4WWR4GovWvw/, but unfortunately I don’t have access to the code I wrote for this project.

You can right click on the page and “view Page Source” and find the code.

Here’s a link to the css you used on that page""
https://codeprojects.org/jean5dv4BSgi4NFlHgJDco8QdDpFqnmK4WWR4GovWvw/style.css

Mike