@correlucas
Posted
👾Hello Hossam, congratulations on your solution!
You did a good job here putting everything together. I’ve some suggestions for you:
Use <main>
instead of a simple <div>
this way you improve the semantics and accessibility showing which is the main block of content on this page. Remember that every page should have a <main>
block and that <div>
doesn't have any semantic meaning.
Use a CSS reset to avoid all the problems you can have with the default CSS setup, removing all margins, and making the images easier to work, see the article below where you can copy and paste this CSS code cheatsheet: https://piccalil.li/blog/a-modern-css-reset/
To reduce your CSS file and improve the performance of loading your page you can use a tool called CSS minify
that reduces the CSS code by removing the unnecessary characters. You can use a VSCode
plugin called minify css
or this website tool to reduce your code: https://www.toptal.com/developers/cssminifier
✌️ I hope this helps you and happy coding!
Marked as helpful