I am the teacher, so I am supposed to be able to answer questions, however, I am struggling. I am working alongside the kids to finish Lesson 13 - my personal web page. I have 3 images and I want the paragraph text to be next to the images. I typed float into the CSS file, but the text is still not moving.
Are there any videos that go with this? I went to Code.org training about 4 years ago, and I don’t remember working on CS Discoveries. I am a remote teacher now, and was assigned this 7th grade course and we are doing CSD Unit 2. We are doing ok, but I would like to be better from the teacher side of things. I have found linked documentation, this forum, and some helpful links. However, I really thought there would be some more videos for teachers. Am I missing something? And does anyone know of a common error in “float” which could be the issue?
Sorry you are struggling! The css float command is a little beyond the scope of what students are expected to know in CSD, but it is a fun command to use and it certainly can be useful.
You shared your css code, but without seeing your entire project, it’s a little hard to troubleshoot. I made a quick demo with three images (all the same image) floated to the left. I used your css and you can see what I was able to create.
I would be happy to look at your project if you could click on the share link and copy the share code and post the link. I could see if there is anything that may not quite be right.
There is a lot on the web (YouTube, etc.) on creating html pages and adding css, but not a ton that is specific to code.org, I don’t believe. If you are interested in learning more about html or css in an easy to follow way, W3Schools has a lot of text instructions and practice pages.
I also highly recommend this 3-4 part series on youTube (each part is about 30 minutes).
The instructor (Colt Steele) has a way of teaching that is easy to follow, but yet still thorough. He is also very relatable. I would even recommend it to students. He really is a teacher and not just a content provider. If you like how he teaches, he sells a 30-40 hour bootcamp on web development on udemy.com for under $20. The course is currently showing a price of $16.99, but you can often find coupon codes to get it to as low as $10-12 and in my opinion it was worth every penny I paid out of my own pocket.
Happy to share more suggestions if you have something more specific you are after.
I added one extra paragraph to your first section so the text would be long enough to get past the image. You could resize the image or there are other ways to solve that problem, but if the text isn’t as tall as the image, it was causing some other issues (2nd picture appeared below the 1st paragraph, but to the right of the first image).
The main thing, though, is that css rules should be on the css page OR you can have them on the html page if they are inside the following html attribute
<img src="image.jpg" style = " CSS RULES HERE SEPARATED BY ;">
If you look at my remix of your page, you will see how I did it. On your first set, you started by using html attributes to restyle your image, but you changed mid-stream to css rules.
Let me know if that doesn’t make sense… I’m happy to try to explain my self a little better.
This helps a lot! Yes, you are making sense. I had a feeling that I had put things in the wrong place. I will study the code you worked on. How do I see the code other than doing View, Source