Pagination-lg not displaying correctly on mobile

Open to all! Ask other shopowners for help.
radhavallabh
Senior Contributor
Posts: 470
Joined: Tue Oct 27, 2020 4:09 am
Phoenix Version: 1.1.0.6
Has thanked: 30 times
Been thanked: 3 times

Pagination-lg not displaying correctly on mobile

Post by radhavallabh »

Hi dear;
On a results page for example advanced_search_results.php; If results have more than 4 pages or 6 pages
The Pagination-lg does not display the pagination box correctly on mobile it rips of the Prev and page no.1 button from the left as the container of the page navigation links do not fit in there.
Original code is as in split_page_results.php

Code: Select all

$display_links_string .= <ul class="pagination pagination-lg justify-content-end">
Please can you help fix the issue dear..
Thank you in advance;
Regds./
radhavallabh



Join The Code Co-op to get access to your library in the Code Co-op Forum
User avatar
burt
Core Team
Posts: 4748
Joined: Tue Oct 29, 2019 9:37 am
Phoenix Version: v1.1.0.8
Has thanked: 281 times
Been thanked: 469 times

Re: Pagination-lg not displaying correctly on mobile

Post by burt »

I am not here to build for you.
I am here to build with you. Let's help each other.

radhavallabh
Senior Contributor
Posts: 470
Joined: Tue Oct 27, 2020 4:09 am
Phoenix Version: 1.1.0.6
Has thanked: 30 times
Been thanked: 3 times

Re: Pagination-lg not displaying correctly on mobile

Post by radhavallabh »

burt wrote: ↑Sat Jun 18, 2022 2:31 pm https://getbootstrap.com/docs/4.6/compo ... agination/

has all of the info you need.
Hi dear;
I already tried using pagination-sm along with pagination-lg but it also sizes down the page links on the desktop screen.
That is why I asked for help here thinking that I shall get a better solution;
Regds./
radhavallabh

heatherbell
Senior Contributor
Posts: 2537
Joined: Mon Oct 07, 2019 4:39 am
Phoenix Version:
Has thanked: 35 times
Been thanked: 243 times

Re: Pagination-lg not displaying correctly on mobile

Post by heatherbell »

radhavallabh wrote: ↑Sat Jun 18, 2022 2:51 pm That is why I asked for help here thinking that I shall get a better solution;
I was curious so did an internet search for 'bootstrap fix pagination on small screens' and found this:
https://stackoverflow.com/questions/501 ... onsiveness

radhavallabh
Senior Contributor
Posts: 470
Joined: Tue Oct 27, 2020 4:09 am
Phoenix Version: 1.1.0.6
Has thanked: 30 times
Been thanked: 3 times

Re: Pagination-lg not displaying correctly on mobile

Post by radhavallabh »

heatherbell wrote: ↑Sun Jun 19, 2022 4:39 am
radhavallabh wrote: ↑Sat Jun 18, 2022 2:51 pm That is why I asked for help here thinking that I shall get a better solution;
I was curious so did an internet search for 'bootstrap fix pagination on small screens' and found this:
https://stackoverflow.com/questions/501 ... onsiveness
Thanx dear the post did help....

'flex-wrap' does work atleast in getting the pagination to fit within screen with a second row appended.

Thank you again;
Very warm Regds./
radhavallabh

heatherbell
Senior Contributor
Posts: 2537
Joined: Mon Oct 07, 2019 4:39 am
Phoenix Version:
Has thanked: 35 times
Been thanked: 243 times

Re: Pagination-lg not displaying correctly on mobile

Post by heatherbell »

radhavallabh wrote: ↑Sat Jun 18, 2022 2:20 pmIf results have more than 4 pages or 6 pages
Presumably you have tried changing admin>Configuration>Maximum Values>Page Links

radhavallabh
Senior Contributor
Posts: 470
Joined: Tue Oct 27, 2020 4:09 am
Phoenix Version: 1.1.0.6
Has thanked: 30 times
Been thanked: 3 times

Re: Pagination-lg not displaying correctly on mobile

Post by radhavallabh »

heatherbell wrote: ↑Sun Jun 19, 2022 5:23 am
radhavallabh wrote: ↑Sat Jun 18, 2022 2:20 pmIf results have more than 4 pages or 6 pages
Presumably you have tried changing admin>Configuration>Maximum Values>Page Links
Cool dear!!
I guess this is a much better of idea!!
I just did not think about it ......

Thank you again :) Fixes the issue completely......
Very Warm Regds./
radhavallabh



Join The Code Co-op to get access to your library in the Code Co-op Forum
Post Reply