Fixed Column – Header Shifts

  • Resolved Sam L.

    (@scionet)


    5 years, 3 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 TobiasBg

    (@tobiasbg)

    5 years, 3 months ago

    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)

    5 years, 3 months ago

    Hello Tobias,

    That css did not work either.

    Plugin Author TobiasBg

    (@tobiasbg)

    5 years, 3 months ago

    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)

    5 years, 3 months ago

    Thank you for your time.

    Plugin Author TobiasBg

    (@tobiasbg)

    5 years, 3 months ago

    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.