I am looking to customize the row and column layout based on the screen size. For example, currently for medium screens, I have the following layout:
<div class="row align-items-md-center">
<div class="col-6">1</div>
<div class="col-2">2</div>
<div class="col-2">3</div>
<div class="col-2">4</div>
</div>
But for mobile screens, I would like it to be:
<div class="row align-items-md-center">
<div class="col-6">1</div>
<div class="col-2">4</div>
<div class="col-2">2</div>
<div class="col-2">3</div>
</div>
Has anyone else encountered this issue before?
Thank you