Is there a way to make elements generated by *ngFor in Angular 2 responsive?
I am using the Bootstrap 4 grid system with flex properties in my Angular 2 application, and this is the code I have:
<div class="outlet container">
<div class="row itemsBlock">
<div *ngFor="let item of items" class="itemRender">
<img class="itemImage" src="{{item.image}}" />
<span class=itemitle">{{item.title}}</span>
</div>
</div>
I would like my items to be rendered responsively as follows:
3 divs in a row on large and medium displays
2 divs in a row on small displays
1 div in a row on extra-small displays