JSFiddle - React, Tailwind, and code Playground

by wisegorilla

HTML

<div class="lottery_steps">

<div class="lottery_step">
  <img src="https://bonmedico.de/wp-content/uploads/2019/02/img-steps_1.png">
  <p>1. Link an Freunde versenden (max. x)</p>
</div>

<span class="lottery_arrow"><img class="lottery_arrow" src="https://bonmedico.de/wp-content/uploads/2019/02/arrow-copy_lottery.png"></span>

<div class="lottery_step">
  <img src="https://bonmedico.de/wp-content/uploads/2019/02/img-steps_2.png">
  <p>1. Link an Freunde versenden (max. x)</p>
</div>

<span class="lottery_arrow"><img class="lottery_arrow" src="https://bonmedico.de/wp-content/uploads/2019/02/arrow-copy_lottery.png"></span>

<div class="lottery_step">
  <img src="https://bonmedico.de/wp-content/uploads/2019/02/img-steps_3.png">
  <p>1. Link an Freunde versenden (max. x)</p>
</div>

<span class="lottery_arrow"><img class="lottery_arrow" src="https://bonmedico.de/wp-content/uploads/2019/02/arrow-copy_lottery.png"></span>

<div class="lottery_step">
  <img src="https://bonmedico.de/wp-content/uploads/2019/02/img-steps_4.png">
  <p>1. Link an Freunde versenden (max. x)</p>

<span class="lottery_arrow"><img class="lottery_arrow" src="https://bonmedico.de/wp-content/uploads/2019/02/arrow-copy_lottery.png"></span>

<div class="lottery_step">
  <img src="https://bonmedico.de/wp-content/uploads/2019/02/img-steps_5.png">
  <p>1. Link an Freunde versenden (max. x)</p>

</div>

CSS

.lottery_steps {
  display: flex;
  margin: auto;
}