Basic CSS - Change a variable for a specific area

HTML-CSS
#1

Hello,

I’m trying to solve this simple challenge
but something is going wrong

This what I must to do :
Change the value of --penguin-belly to white in the penguin class.

<p>:root {
    --penguin-skin: gray;
    --penguin-belly: pink;
    --penguin-beak: orange;
  }
  
  .penguin {
    
    /* add code below */

/*I added this line but it doesn't work, I can't catch what is wrong with it */ 
    background: var(--penguin-belly, white);

    /* add code above */
    </p>

Chalenge link

1 Like
#2

The code you need to type is just:

--penguin-belly: white;
5 Likes
#3

Your code would be : @Stas761
–penguin-belly: white;

image
image808×466 21.8 KB

3 Likes
#4 
<style>
  :root {
   var(--penguin-belly: pink);
      }
  
  body {
    background: var(--penguin-belly, #c6faf1);
  }
  
  .penguin {
    --penguin-skin: gray;
    --penguin-beak: orange;
    --penguin-belly: pink;
    position: relative;
    margin: auto;
    display: block;
    margin-top: 5%;
    width: 300px;
    height: 300px;
  }

type or paste code here

#5