Skip to content
Submitted over 1 year ago

Fylo data storage component

Mateo Rinland•210
@mateorinland
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Fylo data storage component
  • HTML
  • CSS
2junior

Design comparison

SolutionDesign

Solution retrospective

My first time using the <progress> element and my main concern is: if Firefox doesn't allow styling the background of the progress bar nor supports ::before or ::after pseudo classes on it, then in a real world situation the correct thing would be to not use a <progress> element altogether and instead create a custom progress bar that is able to follow the design in all browsers, no?

As always feedback of any type is very much appreciated!

Community feedback

  • theCavyDev•510
    @okeke-ugochukwuPosted over 1 year ago

    I'd say use both. The actual <progress> element (hidden), and a custom progress bar, so in case the stylesheet doesn't load properly or at all, the actual <progress> element is there to save the day.

    Marked as helpful
    1

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