<style>
    #flex-container {
      display: flex;
      flex-direction: row-reverse;
      justify-content: start;

      /* Base styles */
      width: 500px;
      height: 100px;
      background: #c7e6d7;
      border: 0.5em solid #52b788;
    }

    #flex-container p {
      color: #fff;
      height: 100%;
      background: #888;
      margin: 0 0.5em 0 0;
      padding: 0.25em 0.5em;
    }
  </style>
  <div dir="rtl" id="flex-container">
    <p> Item 1 </p>
    <p> Item 2 </p>
    <p> Item 3 </p>
  </div>