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

CSS Float

@bukeme

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


Please, i want to know if this interactive rating component is responsive. I'll be glad if i get prompt responses.

Community feedback

@cazanca

Posted

You can use min function on the div.container. e.g. width: min (90%, 350px). These will apply the smallest value.

0

@bukeme

Posted

@cazanca thanks for your contribution. I really appreciate it

0

@FlashCodX

Posted

Hi Bassey, great work on this challenge! 😉

Here are a few tips for improve your code:

  • Add a main tag on the <div class="container"> instead of a div. It´s good for semantic purposes.
  • Inside the media query, on the div.container add a width of 90% and margin:auto to center the card.
  • Add a cursor:pointer style property on the buttons. To show a hand icon when hovered.

Hope this helps 😉.

0

@bukeme

Posted

@FlashCodX thanks a lot boss

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