Design comparison
Solution retrospective
Hello everyone! I'd like to know how can i improve my writed code? What I did wrong or how can i do it with less lines?
Community feedback
- @correlucasPosted over 2 years ago
Hello Nicolas, congratulations for this challenge!
I saw that you did a good working replicating the challenge and also looking the design everything seems correct. You can consider to fix only two minor details:
1.Use
max-width
overwidth
to your container properties in order to make the container flexible and able to shrink under smaller screens.2.Apply a better and smoother box-shadow using a value around
box-shadow: 5px 5px 15px 5px rgb(0 0 0 / 7%);
the shadow you've applied is too strong. I know is tricky work with shadows so you can use some online tools to have easy and just drop the code on your css.See one good tool for generating css box-shadows here: https://www.cssmatic.com/box-shadow
I hope it helps you improve your solution. Keep it up and happy coding!
Marked as helpful1@nicolas055Posted over 2 years agoHello Lucas, Thanks for your feedback!
I'll try and fix these issues I also really liked that box-shadow generating tool I'm sure It will be very helpful in the future, Thank you so much!
1 - @10highPosted over 2 years ago
Hey there, your solution looks really good, but as you can see from the generated report, your code has a number of issues.
I think it would be a good idea for you to start looking into accessibility, such as using semantic markup. Here's a good intro to the subject: https://www.w3schools.com/accessibility/
Good luck and keep up the good work.
Marked as helpful1@nicolas055Posted over 2 years ago@10high Thanks for your feedback, I'll try to fix this issues and learn more about accessibility before starting my next project!
1
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