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

HTML, CSS, mobile first design

Jane 1,040

@janegca

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


This one was deceptively simple looking, the sizing gave me fits; got myself all tangled up with grid, flex, min/max-width's, got out of trouble thanks to Ahmad Shadeed's post Min and Max Width/Height in CSS.

Building the slider indicator was fun although I wasted a ton of time trying to do it with the HTML <progress> element (that is a nightmare to style), gave it up and just used div and span elements.

Learned a ton about what I don't know, as usual. Feedback welcome 😄

Community feedback

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