My overflow: hidden doesn't work

Hi guys, i started to use css battle, and i can’t figure out why overflow: hidden property doesn’t work here.
it’s the challenge 101

<div> 
  <div id="eye-circle">
    <div class="black-point"></div>
    <div class="circle-one"></div>
  </div>
</div>
<style>
 body{
   background: #161616;
 }
  #eye-circle{
    width: 200px;
    height: 200px;
    background: #A22015;
    border-radius: 50%;
    position: fixed;
    left: 25%;
    bottom: 16%;
    box-shadow: 0 0 0 5.4px
  }
  
  .black-point{
    width: 50px;
    height: 50px;
    background: #000000;
    position: fixed;
    left: 44%;
    bottom:42%;
    border-radius: 50%;
    box-shadow: 0 0 0 10px #E96A23,
                 0 0 0 25px #000000;
    
  }
.circle-one{
  width: 70px;
  height: 70px;
  background: #A22015;
  box-shadow: 0 0 0 13px;
  border-radius: 50%;
  position: absolute;
  overflow: hidden;
  
 
}
  
 

  
</style>

please post a link to the challenge

Oh i didn’t know that , ty

I’m not sure . i’ve proofed in every class

<div> 
  <div id="eye-circle"><div class="circle circle-one"></div>
    <div class="circle circle-two">
      <div class="circle circle-three"><div>
    <div class="black-point"></div>
    </div>
  </div>
</div>
<style>
 body{
   background: #161616;
 }
  #eye-circle{
    width: 200px;
    height: 200px;
    background: #A22015;
    border-radius: 50%;
    position: absolute;
   
    left: 25%;
    bottom: 16%;
    box-shadow: 0 0 0 5.4px;
     overflow:hidden;
    
    .circle {
      overflow: hidden;
      
    }
  }
  
  .black-point{
    width: 50px;
    height: 50px;
    background: #000000;
    position: fixed;
    left: 44%;
    bottom:42%;
    border-radius: 50%;
    box-shadow: 0 0 0 10px #E96A23,
                 0 0 0 25px #000000;
    
    
  }
.circle-one{
  width: 70px;
  height: 70px;
  background: #A22015;
  box-shadow: 0 0 0 13px;
  border-radius: 50%;
  position: fixed;
  overflow: hidden;
  
  
 
}
  .circle-two {
 width: 70px;
  height: 70px;
  background: #A22015;
  box-shadow: 0 0 0 13px;
  border-radius: 50%;
  position: fixed;
   left: 59%;
    overflow: hidden
  
  }

  .circle-three{
    width: 70px;
  height: 70px;
  background: #A22015;
  box-shadow: 0 0 0 13px;
  border-radius: 50%;
  position: fixed;
    bottom: 10%;
    left: 42%;
    overflow: hidden
  }
  
 

  
</style>



This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.