@VCarames
Posted
Hey there! 👋 Here are some suggestions to help improve your code:
- To properly center your content to your page, you will want to add the following to your
Body
element (this method uses CSS Grid):
body {
min-height: 100vh;
display: grid;
place-content: center;
}
More Info:📚
- The “icons/illustrations” in this component serve no other purpose than to be decorative; They add no value. There
alt tag
should be left blank and have anaria-hidden=“true”
to hide them from assistive technology.
More Info:📚
https://www.w3.org/WAI/tutorials/images/
-The proper way to build this challenge is to create a form
and inside of it, the “rating buttons” should be built using an input radio
(wrap all of them inside a fieldset
), since this will prevent additional buttons from being active at the same time, and it should have a label
element attached to it for accessibility.
More Info:📚
MDN <fieldset>: The Field Set element
-
- Your ratings should have an
active
state to let users know which rating they have chosen.
- Your ratings should have an
If you have any questions or need further clarification, feel free to reach out to me.
Happy Coding!🎄🎁
Marked as helpful