::-moz-progress-bar

Non-standard: This feature is not standardized. We do not recommend using non-standard features in production, as they have limited browser support, and may change or be removed. However, they can be a suitable alternative in specific cases where no standard option exists.

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The ::-moz-progress-bar CSS pseudo-element is a Mozilla extension that represents the progress bar inside a <progress> element. (The bar represents the amount of progress that has been made.)

If you want to select the unfinished part of <progress> in Mozilla, please select the <progress> directly.

Syntax

css

::-moz-progress-bar { /* ... */ }

Examples

HTML

html

<progress value="30" max="100">30%</progress> <progress max="100">Indeterminate</progress>

CSS

css

::-moz-progress-bar { background-color: red; } /* Force indeterminate bars to have zero width */ :indeterminate::-moz-progress-bar { width: 0; }

Result

Specifications

Not part of any standard.