Design comparison
Community feedback
- @grace-snowPosted over 2 years ago
Hi
Well done for using radio inputs on this, a lot of people miss that!
Functionally this works ok, but you need to work a bit more on getting it to look like the design. The radios don't look like the design currently and the numbers disappear on mouse hover.
I also notice you are adding a load of inline styles in this. DON'T. Leverage your js to add/remove classes or attributes. Keep styling to css. because of the way you're doing this at the moment, there is a mixture of concerns going on, and you're creating a nasty flash when the content changes as the inline styles are applied and browser has to recalculate height.
Also, look up how to treat alt attributes on decorative images. The alt in this isn't right at the moment.
Good luck
Marked as helpful1@somu-codePosted over 2 years ago@grace-snow Thank you for your valuable feedback. When I hover the mouse on the numbers it changes its color to white, and the background turns orange. I am not sure about how the numbers are disappearing for you on mouse hover. Can you please tell me a bit more context about how my radio buttons do not look like the design??
0@grace-snowPosted over 2 years ago@somu-code they’re not going orange for me on hover, they are grey and the number disappears
Maybe try Firefox as that is my primary browser
Marked as helpful1@somu-codePosted over 2 years ago@grace-snow Well I am only using google google chrome I will try with firefox. I also replace the inline CSS with CSS with classes.
0@somu-codePosted over 2 years ago@grace-snow I just tried with firefox you were right I need to write the CSS again.
0
Please log in to post a comment
Log in with GitHubJoin 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