Tablepress sort arrow icons are covering text

  • Resolved garneranalysis

    (@garneranalysis)


    7 years, 8 months ago

    Hello,

    I am using Tablepress version 1.8 and the issue I have is that, especially in the mobile view, the sorting arrow icons in the header are partially covering up the text in the header box. First, I am hoping to keep the arrows and perhaps padding them so they don’t block text but if this is not possible then I would like to remove the arrow visual while retaining the sorting function.

    I tried some code that I found in a forum from 2 years ago (for removing the arrows) but it is not working for me here:

    .dataTables_wrapper .tablepress-id-123 .sorting:after,
    .dataTables_wrapper .tablepress-id-123 .sorting_asc:after,
    .dataTables_wrapper .tablepress-id-123 .sorting_desc:after {
    content: “”;
    }

    https://www.ads-software.com/support/topic/tablepress-sort-arrows/

    I am not overly experienced with CSS but I’m trying to learn more. Would appreciate any help you can give.

    Thanks,
    Megan

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author TobiasBg

    (@tobiasbg)

    Hi,

    thanks for your post, and sorry for the trouble. Also, please excuse the long wait for a reply. I just returned from holidays last night and was not able to reply earlier. Thanks for your understanding.

    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

    Thread Starter garneranalysis

    (@garneranalysis)

    Hi Tobias,

    Thank you for getting back to me so soon after your holiday.

    The table is not currently live on the website because we were waiting to resolve this issue first. I have taken some screenshots of the table in preview mode and can share them with you via google photos: https://goo.gl/photos/bofUYhpsG3UP8Ku38

    Please let me know if these images will be sufficient for you.

    Megan

    Plugin Author TobiasBg

    (@tobiasbg)

    Hi Megan,

    a link would have been better, but I have a feeling on what’s wrong. We might just have to add some right padding to the header row cells. For that, please add this to the “Custom CSS” textarea on the “Plugin Options” screen of TablePress:

    .tablepress thead th {
  padding-right: 20px !important;
}

    Regards,
    Tobias

    Thread Starter garneranalysis

    (@garneranalysis)

    Excellent! That seems to have resolved the issue! Thank you for your assistance Tobias.

    Megan

    Plugin Author TobiasBg

    (@tobiasbg)

    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!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Tablepress sort arrow icons are covering text’ is closed to new replies.