Desktop Initial table size with horizontal scroll option

  • Resolved px

    (@peterxura)


    11 years ago

    Hi Tobias,

    I used the horizontal scroll option for tablepress to work on the mobile version of my website. However, this created problems with the desktop version as the table columns are initially shown in a squished state. It still adjusts if the window size is changed in any way but won’t automatically adjust when the website loads.

    Here is a screenshot of when it initially loads:
    http://imgur.com/AiYgu5m

    Here is a screenshot when I change window size, change zoom, etc:
    http://imgur.com/CyNpT4r,AiYgu5m#0

    Are there anyways to fix this without having to uncheck the horizontal scrolling option?

    Also, the search option seems to be a little off as it is in two rows, on mobile it is backwards as the box comes before the “search” text. Advice on fixing that would be helpful too.

    Thank you so much for your help!

    https://ww.wp.xz.cn/plugins/tablepress/

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Tobias Bäthge

    (@tobiasbg)

    11 years ago

    Hi,

    thanks for your post, and sorry for the trouble.

    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!

    One idea might be to use a different kind of Horizontal Scrolling (instead of the checkbox), namely from https://ww.wp.xz.cn/support/topic/responsive-tables-scroll-only?replies=6#post-5511954

    Regards,
    Tobias

    Thread Starter px

    (@peterxura)

    11 years ago

    Hi,

    I just took your instructions for CSS scrolling and it works amazingly; there are no more errors with the mobile or desktop versions!

    I would also greatly appreciate it if you can take a look at the “search” area as well.

    Here is the site.

    Thank you so much once again!

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    11 years ago

    Hi,

    good to hear that this helped already 🙂

    To fix the search positioning, please add this to the “Custom CSS” as well:

    .dataTables_wrapper label input {
  float: none;
  margin: 2px 8px;
}

    Regards,
    Tobias

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Desktop Initial table size with horizontal scroll option’ is closed to new replies.