// html

<ul>
  <li><button>1</button></li>
  <li><button>2</button></li>
  <li><button class="special">3</button></li>
</ul>


// css

ul {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    border: 5px solid blue;
    height: 10rem;
  }
  .special {
    justify-self: flex-end;
  }


// result




3번 블록만 container 맨 아래 위치하게 하고싶은데

3번 블록에 justify-self: flex-end 하니까 안된다..


ul에다가 justify-content: flex-end 하면 통채로 맨 아래로 이동하는데

왜 개별적으로는 안되는거임?