CSS Battle #109 Curtain.html

https://cssbattle.dev/play/109

<div class="a">
  <div class="b"></div>
  <div class="b"></div>
  <div class="b"></div>
  <div class="b"></div>
</div>
<div class="a">
  <div class="b"></div>
  <div class="b"></div>
  <div class="b"></div>
</div>
<div class="a">
  <div class="b"></div>
  <div class="b"></div>
</div>
<div class="a">
  <div class="b"></div>
</div>
<style>
  * {
    margin: 0;
    background: #191919;
  }
  .a {
    display: flex;
  }
  .b {
    margin: 20px 0 0 20px;
    width: 40;
    height: 40;
    border-radius: 50%;
    background: #F6E59C;
    
  }
</style>

##########
Optimized version

<div a><div b></div><div b></div><div b></div><div b></div></div><div a><div b></div><div b></div><div b></div></div><div a><div b></div><div b></div></div><div a><div b></div></div><style>*{margin:0;background:#191919;}[a]{display:flex;}[b] {margin:20px 0 0 20px;width:40;height:40;border-radius:50%;background:#F6E59C;}</style>