Question

Ive tried to use the rgba() to define a div’s background color, but instead of changing the opacity, the fourth value changes brightness (apparently), and rendering the rounded borders black. Here is my CSS, really simple stuff:

#content {
    min-height: 200px;
    padding: 25px;
    border-radius: 50px;
    background-color: rgba(169, 245, 208, 0.4);
}

And here is a picture of this issue in both Firefox and Chrome:

Finally, the URL of the site: http://lksonorizacao.com.br/newsite/

Answer 1

The #container parent has a background:#000 set on it. #content’s rounded corners are just revealing that black. rgba() does work the way you think it should.