How do i remove the border of a progress HTML element?

I have a progress bar that shows the shows the computed % of uploaded bits of the videos the user selects.

I want these progress bars to not have any border around them. This is what i have right now:

enter image description here

And i want to remove the ever-so small border around both progress bars. I tried:

progress {
    border: none;
    box-shadow: none;
}

and a few other things that didnt work.

Upvotes: 2

Views: 1650

Answers (1)

Zak
Zak

Reputation: 7515

in the <progress> element, border:none; is only supported by Firefox .. For all other browsers, you'll need the folowing:

progress[value] { 
    -webkit-appearance: none; 
    appearance: none;
}

Upvotes: 2

Related Questions