Horizontal scroll bar displays after loading table

Hi,

thanks for your post, and sorry for the trouble.

The reason for this probably is that the JS code simply takes a few moments to process and calculate the width of columns, etc.
It might however be possible to at least not let the table over-run on the right side, by wrapping it in an extra <div> container, like

<div style="overflow:hidden">[table id=123 /]</div>

For the problem on mobile: This should not happen and likely means that something is causing a script error. In general, the full table will be loaded here as well, but then the pagination should be added, just like on the desktop.

Regards,
Tobias

Hi Ester,

that’s good to hear!

No, that script error is probably the result of some other JavaScript file on the page. Can you please post a link to the page with the table where this problem happens, so that I can take a direct look? Thanks!

Regards,
Tobias

Hi,

thanks for the link! I checked the page in the simulators in Chrome as well as on my Android phone. While it took a few moments to load and execute everything, the pagination worked just fine, after finishing loading.

Regards,
Tobias

Hi,

no problem, you are very welcome! 🙂 Good to hear that this helped!

Yes, it just takes some time to process a big table on a phone :-/

Best wishes,
Tobias

Hi,

I’m afraid that that’s not easily possible as the tables don’t have a wrapper <div> by default.

You could however add one with this piece of PHP code in your theme’s “functions.php”:

add_filter( 'tablepress_table_output', 'tp_add_overflow_hidden_wrapper', 10, 3 );
function tp_add_overflow_hidden_wrapper( $output, $table, $render_options ) {
  $output = "<div class=\"tablepress-overflow-wrapper\">\n{$output}\n</div>";
  return $output;
}

and then use “Custom CSS” like

.tablepress-overflow-wrapper {
  overflow: hidden;
}

Regards,
Tobias

Hi,

no problem, you are very welcome! 🙂 Good to hear that this helped!

Best wishes,
Tobias

P.S.: In case you haven’t, please rate TablePress here in the plugin directory. Thanks!