How to separate elements on different sides?

Question

css

Please help me stick the green block to the right edge of the parent block. It is advisable to use only the features of flexbox. When squeezing the width of the browser window, the empty space between the 4th and 5th blocks should shrink and eventually disappear

DEMO

<div class="parent">
  <div class="child">1</div>
  <div class="child">2</div>
  <div class="child">3</div>
  <div class="child">4</div>
  <div class="child">5</div>
</div>

.parent {
  display: flex;
  border: cyan;
  border: 1px solid red;
}

  .child {
    width: 50px;
    height: 50px;
    border: 1px solid red;
  }
  
  .child:last-child {
    align-self: flex-end;
    background: lime;
  }