Background-color to transparent

Tell us what’s happening:
Trying to make the background-color transparent, Any advice please?

Your code so far


<style>
.center
{
  position: absolute;
  margin: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100px;
  height: 100px;
 
  background-color: opacity(0%);
  border-radius: 50%;
  box-shadow: 25px 10px 0 0 blue; 
}
</style>
<div class="center"></div>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:61.0) Gecko/20100101 Firefox/61.0.

Link to the challenge:
https://learn.freecodecamp.org/responsive-web-design/applied-visual-design/create-a-graphic-using-css

3 Likes

you can just set the background color to any color you like and use the opactity css-propterty.
for example:
.center {
background-color: blue;
opacity: 20%;
}

another solution might be to use rgba for your background-color:
https://www.w3schools.com/css/css3_colors.asp

1 Like

I tried that way too but it gives me “/ running test
The value of the background-color property should be set to transparent.
// tests completed” when I click RUN THE TESTS.

After some googling found the answer, to make the background color transparent.
“background-color: transparent;”
I was with the intention that the it should be “opacity:”
but I was wrong.

1 Like