You need to use the two separate boxes. This is meant to act as documents. The .html acts as a HTML file whereas the .css acts as a CSS file. Understanding how to utilize them is beneficial when you take projects away from FCC and begin to make your own files and link them together. Also, having them in separate files is easier to read.
I didn’t like the sizing of my image which i added in the html box
so I added “width: 100%” in the image code and it has resized the image
…but is this “width:100%” supposed to go into the CSS box? i’m aware that it’s not using the CSS style property… is it still classified as CSS? (sorry if it sounds like a very stupid question, i’m very new to all of this!)
Yes, that would be considered a CSS property. If you have more than one image you can give the image you want to resize an id attribute and then use a CSS selector to adjust the width of the given id.
In this case since it is just one image, then using an id is fine.
But once you start building out larger projects, you will want to use classes for styling and ids for selecting elements in javascript.
It makes it easier to use a class to style several images in the same way instead of using a whole bunch of ids.
If you have multiple things such as images that you wish to style in the same manner then using classes makes sense. However, if it is just one you wish to style would an id be the appropriate styling selector or should you still use class.
Also, the reason why freeCodeCamp wants you to use ids here for these projects is because it makes it easy to test your code behind the scenes with JavaScript.