Design comparison
Solution retrospective
So I only did the mobile version for a couple reasons. I cant really figure out the slider. I'm not sure if its just two divs with different background colors and another div for the circle or its a input. Also I had a bit of trouble with the bottom white box with 185 gb left. PLEASE someone give me some tips and info on what I can do to complete this challenge, first time attempting it.
I was having come issues with a couple things so I only did mobile for the first attempt but will definitely go at this again
Community feedback
- @SantiagoPoncePosted almost 2 years ago
HI! I didn't the challenge but from what I saw in your code you put a misleading padding on the range input to widen it, which gives a confusing performance since it seems to never finish filling or emptying. Try to remove that padding and use the inline-size property with a value of 90% (or whatever you want to fill the space) On the other hand, I think that the exercise does not warrant using a range input, I think that the <progress> or <meter> element would be more appropriate (although I would not know how to put the point in the current value)
Regards
Marked as helpful0@LozzekPosted almost 2 years ago@Santiagoponce Thanks for the feedback, I never heard or used the meter or progress tags but I will give them a try. Also i'm not sure if you got to look at the bottom box with the text 185 GB LEFT I was wondering if you could tell me what I did wrong there, if you have any spare time.
Thanks
0
Please log in to post a comment
Log in with GitHub
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