Skip to content
Submitted about 3 years ago

interactive-rating-component-main

Ko Loy Yee•50
@koloyyee
A solution to the Interactive rating component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

When should I use flex and grid? How can I add animation to the card flip horizontally? Is there a better practice for CSS?

Code
Couldn’t fetch repository

Please log in to post a comment

Log in

Community feedback

  • Ko Loy Yee•50
    @koloyyee

    Hey Hariz, thanks for replying! Originally I did use radio buttons, I don't remember why I changed it my mind, I also tried to use data-* as I have learnt from Javascript 30, I want to test it out too, and sure next time with the same situation I would use radio buttons instead.

    I will search Kevin Powell thank you!

  • Hariz•100
    @sj0n

    Before grid was available, Flexbox was used for layout and to construct components. Now that grid is widely supported, you can use either. But generally, you would use Flexbox to construct components and grid for layout depending on how complicated the layout is.

    For your rating component, you should use radio-type input because with radio-type input you could only choose one option and that is suitable for this problem. Once that is done, you would use JavaScript to get the value from the input and display it.

    Lastly, I recommend you to watch Kevin Powell's video on CUBE CSS which teach you how to better structure your CSS.

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