Design comparison
Solution retrospective
To be honest, I'm proud I was able to complete this task. It's the first thing I've ever made after being self-taught by reading a couple of tutorial websites. It was overwhelming to have an open-ended problem to solve without structure, but I completed it.
I think next time, I'd try to plan a bit more carefully about what needs to be done before jumping in.
What challenges did you encounter, and how did you overcome them?I don't think I completed the task in a very logical way. I tried to start adding the necessary HTML and add the CSS after but I think my understanding of what needed to be done was not sufficient to plan clearly enough this way and trying to solve problems meant adding/nesting div elements to get the alignment correct. I'm worried this has made the code messy or unoptimised.
I didn't have any prior knowledge of rounding corners - so I found border-radius by googling what I wanted.
I also struggled trying to find a way to centralise the box vertically - I initially knew that I could use margin:auto to centralise horizontally, but couldn't solve the problem vertically. I ended up copying a solution from google that tackled it differently, but that I need to further read up on to understand.
What specific areas of your project would you like help with?Feedback on how to optimise or make less messy - whether there was a better solution than nesting divs to fix the alignment of all elements for example.
Any guidance or signposting to good resources about the alignment code used.
Community feedback
- @SvitlanaSuslenkovaPosted 2 months ago
Hi. It looks good. Your whitecontainer <div> should become <main> and first <p> should be <h1>. Consider to read a little about sematic elements in html. Hope you found this comment helpful :)
0
Please log in to post a comment
Log in with GitHubJoin 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