BUG: Responsive doesn't adjust page navigation bar to fit to screen.

hingston

Not sure how to post this as a bug report.

Step 1: https://jsfiddle.net/q0p5yo2e/
Step 2: Adjust the column so the right side is 400px or less
Step 3: Click run

The adjust page navigation bar is too large and prevents the page from properly fitting on the screen. This is a problem for all mobile users and Google flags this as a mobile unfriendly page.

It could be fixed by displaying less page numbers.

colin

Hi @hingston ,

If you want to display less page numbers, you can set that with pagingType. There are also various plugins that offer different paging styles.

Cheers,

Colin

hingston

I want all the page numbers for desktop users. Shouldn't it be the job of the responsive addon to dynamically set this for smaller screens?

colin

Yep, I see your point. Some users might want the opposite, perhaps, remove the page numbers and just leave the next/prev buttons. Maybe there should be paging styles for each footprint, something like this.

I just checked, and there is an outstanding feature request for this ("Full numbers pagination control should be responsive") scheduled for DataTables 2.0.0. I'll add this thread onto that discussion so this will be updated when the functionality is released.

C

hingston

Another thing is even with "pagingType": "simple" the page still has extra space to the right. I have no idea what would be causing that.

https://jsfiddle.net/q0p5yo2e/1/

allan

Do you mean the left? I don't see any space on the right of the table.

On the left the space is being defined by:

body > .container {
    padding: 60px 0 0;
}

The best way to find stuff like that out is to right click on the area of interest and then select "Inspect".

Allan