Why ::-webkit-progress-value has no effect Posted on October 9, 2023

You can use the ::-webkit-progress-value selector to style <progress> bars in Chrome and Safari.

If the selector does not work and your CSS styles have no effect, it’s probably because of this Chromium bug. The ::-webkit-progress-value selector does not work if there are other selectors around it:

::-webkit-progress-bar, ::-moz-progress-bar{
    /* Does not work */
}

progress::-webkit-progress-bar{
    /* Does not work */
}

::-webkit-progress-bar{
    /* Works */
}