Fixed Column – Header Shifts

  • Resolved Sam L.

    (@scionet)


    6 years, 2 months ago

    Hello

    I tried your fix to the Fixed Column – Header Shifts thread and none of it works for my issue for mobile. Column 1 is fixed with this shortcode:

    [table id=17 datatables_fixedcolumns_left_columns=1 datatables_fixedcolumns_right_columns=0 /]

    But on mobile the headers and columns shift and do not align. I tried the font size with:
    .tablepress thead th {
    font-size: 1.286rem;
    }

    And tried each of these:

    .tablepress.fixedHeader-floating {
    table-layout: auto;
    }

    @media (max-width:756px) {
    .tablepress.fixedHeader-floating {
    display: none !important;
    }
    }

    Thank you.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Tobias B?thge

    (@tobiasbg)

    Hi,

    thanks for your post, and sorry for the trouble.

    One more thing that you could try:

    .tablepress {
  border-collapse: separate;
}

    This might allow the DataTables JS library to calculate the proper width more easily.

    Regards,
    Tobias

    Thread Starter Sam L.

    (@scionet)

    Hello Tobias,

    That css did not work either.

    Plugin Author Tobias B?thge

    (@tobiasbg)

    Hi,

    unfortunately, I’m out of ideas here then ?? There are scenarios in which the external DataTables JS library can’t properly calculate the widths. It seems like you are affected by that here. Sorry that I can’t provide a solution.

    Regards,
    Tobias

    Thread Starter Sam L.

    (@scionet)

    Thank you for your time.

    Plugin Author Tobias B?thge

    (@tobiasbg)

    Hi,

    sure, no problem! Sorry again that I could not really help here!

    Best wishes,
    Tobias

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Fixed Column – Header Shifts’ is closed to new replies.