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

Interactive Rating Card using jQuery

Liz 80

@Azulio123

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


I don't have any specific questions for this project. I am still working to wrap my head around Javascript and coding altogether. I am taking an in person course for JS and hoping to sharpen my skills.

Of course, any and all feedback is welcome. You guys are awesome.

Community feedback

FlimzYT 110

@FlimzYT

Posted

Nice but there is a bug were if I click on one and then change my mind and then submit, it shows that I have submitted the first option I picked

Marked as helpful

0
P
visualdennis 8,375

@visualdenniss

Posted

Good work Liz!

I'd suggest instead of using padding with percentages like this padding: 7% 2%; which might result in losing control over positioning easily when resizing, use flexbox or grid to center the rating component. e.g.

body { display: flex; justify-content: center; align-items: center; flex-direction: column; }

Also you might need to have display: none for the thank you section as even tho it is set to visibility:hidden, it is still taking space in the layout. You can make it display again with JS after submit.

Also i'd suggest not using fixed heights or max-heights (e.g. max-height: 450px; ) for text containing elements as it can cause accessibility issues.

Hope you find this feedback helpful!

0

@hectorHook

Posted

I wish you to feel the power of your dreams in every moment of your life. May success be yours. I wish you to live your passions, which are the protagonists of your success, with every breath. Congratulations 👏 I wish you to feel the power of your dreams in every moment of your life. May success be yours. I wish you to live your passions, which are the protagonists of your success, with every breath. Congratulations

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