
Design comparison
Solution retrospective
I am proud that I learned how to group HTML elements in order to manipulate them as a block in CSS. I used github copilot to help me center this <div>, what I would do differently next time is to breakdown the AI code, understand it, and come up with it on my own.
What challenges did you encounter, and how did you overcome them?The most difficult task in this project that I found is that the <img> did not fit correctly in the <div> as the design showed. I tried to use the padding but for some reason this messed up with the border-radius property, so I tried using margin and it worked flawlessly. I also fine tuned the values of the <img> and the <div> manually in order to try and fit my work to the design as much as possible.
What specific areas of your project would you like help with?Thankfully none, I tried my best and figured out what I needed to do to get the result as close as possible to the design. I might need the help of a senior to manually check the code and point out the best practices that I missed, as I am sure at my level, I most likely created a spagetti code that if scaled, would break.
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord