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!
@okeke-ugochukwu
Posted
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
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
