LEE.SOL > CSSBattle > Daily Targets (260309)

Daily Targets (260309)

코드

<b>
  <p></p>
  <p r></p>
  <p></p>
</b>
<b s>
  <p r></p>
  <p></p>
  <p r></p>
</b>
<style>
  &>* {
    display: flex;
    align-items: center;
    padding: 0 22;
    background: #EBE77E
  }

  b {
    display: flex;
    gap: 10px
  }

  [s] {
    margin-left: auto
  }
  
  p {
    /* 보라색 '∩' 모양 표현  */
    width: 30;
    height: 200;
    background: #7E6293;
    border-radius: 99q 99q 0 0
  }

  [r] {
    /* 분홍색 '∪' 모양 표현  */
    background: #DE817E;
    transform: scaleY(-1)
  }
</style>