Design comparison
Solution retrospective
Here is my solution to the Interactive rating component āØ
š Happy to hear any feedback and advice. Thanks!
Community feedback
- @HassiaiPosted almost 2 years ago
wrap <div class="attribution"> in the footer tag to fix the accessibility issue.
There is no need to give the body a max-width value. Add a background-color of pale-blue to the body and change the value of the background-size to contain.
To center the main on the page, add min-height:100vh; display: flex; align-items: center: justify-content: center; or min-height:100vh; display: grid place-items: center to the body.
Hope am helpful.
Well done for completing this challenge. HAPPY CODING
Marked as helpful1 - @VCaramesPosted almost 2 years ago
Hey there! š Here are some suggestions to help improve your code:
- The
article
andsection
element is being used incorrectly ā ļø and not needed for this challenge .
- Your
CSS Reset
is being underutilized. š¢ To fully maximize šÆ it, you will want to add more to it. Here are some examples that you can freely use š: Josh Comeau Reset Eric Meyer Reset
- ā ļø In the
media-query
you only need to include code that is being changed; no need to repeat code that is not changing.
If you have any questions or need further clarification, feel free to reach out to me.
Happy Coding! šššŖ
Marked as helpful0@PaulaR-05Posted almost 2 years ago@vcarames Heeeey! Thank you so much for helping me out! Could I ask one more thing? *[The article and section element is being used incorrectly ā ļø and not needed for this challenge ] Should I use "div" instead of article or section? I thought it would be better to use them.
thanks, all your comments have always helped me a lot!:)
0@VCaramesPosted almost 2 years ago@PaulaR-05
Glad I could help!
Yup! That would be the best choice.
In order to use the
article
element the component needs to be able to make sense on its own and be independently distributable (can be used in on another site).While the
section
is to define groups that have related content in a full site; Think book chapters.Hope this clears things up.
Marked as helpful1 - The
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