Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive, CSS Grid, DOM Manipulation

Shea 210

@sh0910

Desktop design screenshot for the Interactive rating component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Styling the radio buttons was a bit tricky, and it took some time for me to make it look close to the original design. I'd appreciate any feedback, thank you!

Community feedback

@devsotter

Posted

"Congratulations on your work! I have a tip for you. In the '.rating > label' class, where you define the styles to position the content of the buttons, you used the 'display: flex' and 'position: absolute' properties o try center the numbers. You can just use 'text-align: center;' to center them. That way they will remain perfectly centered. Hope this helps."

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join 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