Design comparison
SolutionDesign
Solution retrospective
What are you most proud of, and what would you do differently next time?
If I recall it correctly, I just eyeballed the design. Not really looked into the design file. Which is I'm proud. But it's better to build the challenge with the design.
What challenges did you encounter, and how did you overcome them?Not much since I have some background on how to convert the design to html/css
What specific areas of your project would you like help with?JavaScript, diving deep into it.
Community feedback
- @joaskrPosted almost 2 years ago
Hi :) Good job with the solution! It looks just like the design! Here are some minor suggestions if you want to improve your code :)
Accessibility
- You should use HTML landmark elements such as <header><nav><main><footer> because they improve accessibility. In your code you can change
<section class="container">
to<main class="container">
Visual aspect
- I noticed a small bug in your solution. When you open the site on mobile in landscape mode the design gets a little bit broken. You might want to look into that.
Code
- You are using px in your project. As per the responsive design best practices you should use rem and em. Here's a nice blog post explaining them.
Overall, great job! Let me know if you have any questions
Keep coding and good luck with future challenges!
Marked as helpful1 - You should use HTML landmark elements such as <header><nav><main><footer> because they improve accessibility. In your code you can change
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