Pretraži podršku

Izbjegni prevare podrške. Nikad te nećemo tražiti da nas nazoveš, da nam pošalješ telefonski broj ili da podijeliš osobne podatke. Prijavi sumnjive radnje pomoću opcije „Prijavi zlouporabu”.

Saznaj više

Styling the <meter> tag

  • 2 odgovora
  • 1 ima ovaj problem
  • 100 prikaza
  • Posljednji odgovor od Admin

more options

Hi!

I have a problem with styling the meter tag. Read this article but there is no mention of this. Styling the <meter> tag

I want the meter to have round edges so I tried putting border-radius on meter::-webkit-meter-optimum-value but it didn't work. Putting it on the meter::-moz-meter-bar gave me round edges on the filling (see the photo) but the background still has 90° edges.

Does anyone know how can those background edges be styled?

Hi! I have a problem with styling the meter tag. Read this article but there is no mention of this. [https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meter Styling the <meter> tag] I want the meter to have round edges so I tried putting border-radius on meter::-webkit-meter-optimum-value but it didn't work. Putting it on the meter::-moz-meter-bar gave me round edges on the filling (see the photo) but the background still has 90° edges. Does anyone know how can those background edges be styled?
Priložene slike ekrana

Izmjenjeno od cor-el

Izabrano rješenje

Try to set the radius on both meter and the meter-bar.

meter{
  background: #0f0;
  border-radius:2rem;
}

meter::-moz-meter-bar {
  background: #f00;
  border-radius:2rem;
}
Pročitaj ovaj odgovor u kontekstu 👍 1

Svi odgovori (2)

more options

Odabrano rješenje

Try to set the radius on both meter and the meter-bar.

meter{
  background: #0f0;
  border-radius:2rem;
}

meter::-moz-meter-bar {
  background: #f00;
  border-radius:2rem;
}
more options

That's it!

Thanks for the help. :)