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

Flyo Data Storage Component Using HTML and CSS

Amir Afsharβ€’ 140

@Afshar07

Desktop design screenshot for the Fylo data storage component coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Any tip would help ! P.S: i don't know why my range slider is look weird in Screen shot, but if you open the live url it should look like the original UI.

Community feedback

rafetβ€’ 925

@rafetbasturk

Posted

Hello Amir!

Your range slider seems okay on Chrome. But it does not seem okay on Firefox. Range slider stylings are different on browsers. You only styled for -webkit- on your stylesheet. You should also style for -moz- prefix.

Happy coding!

0

Amir Afsharβ€’ 140

@Afshar07

Posted

@rafetbasturk Hey rafet, thanks for the tip, i didn't think of that. I'mma correct this ASAP. Thanks for your feedback ❀️

0
rafetβ€’ 925

@rafetbasturk

Posted

@Afshar07

You are welcome. Watch out for the pseudo element names. You should use ::-moz-range-track instead of ::-webkit-slider-runnable-track and ::-moz-range-thumb instead of ::-webkit-slider-thumb

Happy coding!

0
Amir Afsharβ€’ 140

@Afshar07

Posted

@rafetbasturk Thanks again, this is kind of you to show me solutions πŸ€œπŸΎπŸ€›πŸΎ I'm a newbie and i don't know about a lot of stuff, thanks for the hint Wish you the best

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