Greetings.
Congratulations for taking on your first challenge.
HTML
- Do some research about landmark elements. The best resource will be Landmark elements. They are very important for the structure and organisation of your site. For this site , you need to have the
mainelement which is responsible for identifying the primary content of the page. That is to say the div with the class container should be themainelement . You can also use thefooterelement for the code with the classattribution - All images in your HTML should have an
altattribute where , when the image is decorative the value should bealt="", other than that , the value should be descriptive bringing out the message carried in the image. - Use semantic elements always to improve the accessibility of your site, among others , you would need a heading element. Since this is just a component from the main page , you should have an h2 heading element instead of the span element with the class title. The other span should be a
pelement. Refer to the MDN docs for guidance
CSS
- Seaprate your CSS from the HTML by creating a separate css file and then importing it into the HTML
- Do another research on a modern css reset stylesheet which you need to normalise your webpages. One common one is written by Andy Bell
- Other centering methods includes
flexandgrid, that is just to increase your choices when it comes to centering elements - Avoid setting the height of containers as that can cause some issues if the content fails to fit . Let the content decides the height to use as for the width you would need to have a combination of
max-widthinremso that the element can extend to a certain width and thewidthproperty can be a percentage. - Line height should be unitless , so in this case instead of
140%it should be 1.4
Marked as helpful
0
