<h3>1. flex-end</h3>
<div class="container one">
  <div class="box">1</div>
  <div class="box">2</div>
  <div class="box">3</div>
</div>

<h3>2. row-reverse</h3>
<div class="container two">
  <div class="box">1</div>
  <div class="box">2</div>
  <div class="box">3</div>
</div>
.container {
  width: 200px;
  height: 200px;
  display: flex;
  background-color: lightblue;
  align-items: center;
}
.container.one {
  justify-content: flex-end;
}
.container.two {
  flex-direction: row-reverse;
}
.box {
  width: 50px;
  height: 50px;
  border: 1px solid black;
  background-color: salmon;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.