Row Details throws off column alignment

  • Resolved eisakov1

    (@eisakov1)


    4 years, 8 months ago

    Hello,

    I’m having an issue when using the datatables row details feature of tablepress. In the last part of the details child row, in the “Service Description.” When there is more than one line of text here, the columns seem to “shift.”

    In the webpage you can see for Aperture Science there is one short sentence for service description, so no shift occurs. for the Wayne Enterprises dropdown, there are several lines in “service description,” so when the drop down is clicked it shifts all the columns around.

    I’ve played with every other cell, and the only thing that causes this shifting is if there’s more than one line of text. This happens regardless of padding in the plugin options css. I tried setting the widths of the always visible columns to no success. I’m out of ideas for what to try.

    Any help is appreciated.
    Best,
    Emanuel.

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter eisakov1

    (@eisakov1)

    4 years, 8 months ago

    On the chance the error doesn’t replicate, here’s a screen recording.
    https://imgur.com/a/Gk35buW

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    4 years, 8 months ago

    Hi,

    thanks for your post, and sorry for the trouble.

    Indeed, I can’t seem to reproduce this, neither in Chrome nor Firefox…
    Can you maybe try again when you are not logged-in on your site, e.g. by using a “Private”/”Incognito” browsing tab?

    That being said, it might be more future-proof to not use the Row Details Extension here, but the TablePress Responsive Tables Extension (see https://tablepress.org/extensions/responsive-tables/ ). With the proper configuration of class names (in the “Custom Commands” field of the table), you could achieve the result, with the bonus of having the table responsive.

    Regards,
    Tobias

    Thread Starter eisakov1

    (@eisakov1)

    4 years, 8 months ago

    Tobias,

    Thanks for responding. I tried opening this in safari on Mac and this issue doesn’t happen, but in microsoft edge on PC or chrome on any device it still appears, whether I’m logged in or not. Do you have any other ideas..? I’m at a loss.

    The responsive tables seems like a good idea but where I’m at a disadvantage is that CSS and HTML are still very new to me. So in terms of making this table function similarly, I’m not sure I’d even know where to start.

    Plugin Author Tobias Bäthge

    (@tobiasbg)

    4 years, 8 months ago

    Hi,

    I still can’t reproduce this, and I have no clue what could be going on here, sorry 🙁

    As for the Responsive Tables Extension: You should only have to install and activate that, with its collapse mode, and then add this to the “Custom Commands” text field on the table’s “Edit” screen:

    "columnDefs": [ { "className": "none", "targets": [ 6, 7, 8, 9, 10, 11 ] } ]

    Regards,
    Tobias

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

The topic ‘Row Details throws off column alignment’ is closed to new replies.