Submitted over 2 years ago

Interactive Rating Component

Taha• 310

@thaykrgl

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

Interactive rating component

HTML
CSS
JS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

I would be very happy if you could help me with the parts I need to improve. Thank you for your feedback.

Community feedback

Kamasah-Dickson• 5,590

@Kamasah-Dickson

Posted over 2 years ago

Okay then you can try this on the container display:flex; align-items:center; Justify-content:center; Min-height: 100vh;

If it still not working you can check my solution here

https://www.frontendmentor.io/solutions/responsive-interactive-rating-component-made-with-css-flexbox-rJGDnhw4q

Taha• 310

@thaykrgl

Posted over 2 years ago

@Kamasah-Dickson now working thanks!

Kamasah-Dickson• 5,590

@Kamasah-Dickson

Posted over 2 years ago

@thaykrgl am so glad you were able to figure it out

Good job👍 Happy coding💪

Kamasah-Dickson• 5,590

@Kamasah-Dickson

Posted over 2 years ago

Remove the margin top 16rem from the card and use Display: grid; Place-content:center;

that's all. Also learn CSS grid and flexbox to solve your prob.

Good job keep coding🙋👍

Taha• 310

@thaykrgl

Posted over 2 years ago

@Kamasah-Dickson thanks for your feedback but it did not work for me.

Kamasah-Dickson• 5,590

@Kamasah-Dickson

Posted over 2 years ago

@thaykrgl did you add a Min-height:100vh ??

Add a min height to it will work.

Taha• 310

@thaykrgl

Posted over 2 years ago

@Kamasah-Dickson still not working.

Please log in to post a comment

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