Responsive Pagination issue

On a Reactive WebApp, I have a screen with an Adaptive\ColumnsMediumLeft on the left side I have a ListItem with pagination and on the right side, I show the content for the item clicked on the list.

When I’m in the mobile view the number of cards on the pagination is responsive and changes to 1,2…35 records.

When I am in around 2223px to 1041px, 32" monitor I have the pagination still showing responsive but with 1,2,3,4…35 records>

When a switch for a laptop screen, for example, around 1496px to 465px I have an issue with the responsive behaviour on the pagination showing like:

I could be wrong but looks like on page load as per the size of the screen the pagination show more or fewer cards, for some sort of javascript on the pagination component.

There is a way to control the number of cards showing in the pagination as per the size of the screen or any better way to fix this issue? 

The pagination must be in the left column on the “Adaptive\ColumnsMediumLeft”.


Rank: #377

You might have an easy work around by moving that '1 to 20 of 684 items' line to somewhere else with some sort of css rule or perhaps a 'move to' widget, leaving the entirety of the bottom line for the navigation