Support » Fixing WordPress » My tables are not mobile responsive

  • Dear Team – I have been looking for a solution to make the tables on my website mobile responsive. However I am running into not so helpful CSS tips and plugins.

    I’ve seen few tables on other websites where they have the tables intact with a horizontal scroll feature so readers can slide towards right to see all then columns/contents. Here’s an example page for your reference – https://www.webadvanced.com/news/painless-responsive-tables. The horizontal scroll example is shown under the sub topic “Horizontal Scroll Method”

    Any way to incorporate that for my tables? Since I am not technically savvy, I need your guidance to make my tables mobile responsive.

    Thank you!

    • This topic was modified 6 months, 1 week ago by subbchtl.
    • This topic was modified 6 months, 1 week ago by Jan Dembowski.

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

Viewing 11 replies - 1 through 11 (of 11 total)
  • Hi There

    add this CSS if your are looking something like attachment
    https://www.awesomescreenshot.com/image/16975840?key=eb6161122a6b5573077aab1fc18a03ea

    @media screen and (max-width: 480px){
    .entry-content .table-wrapper {
        overflow-x: scroll;
        overflow-y: hidden;
        white-space: nowrap;
    }
    }

    thanks

    • This reply was modified 6 months, 1 week ago by Yogesh Yadav.
    Thread Starter subbchtl

    (@subbchtl)

    Thanks. I added this CSS but I don’t see any changes to the table as I see in your screenshot. Also I don’t see a horizontal scroll bar at the bottom of the table.

    Could you check again and let me know if there is anything else I need to do please.

    Thank you

    please update CSS once again, it’s not reflecting

    Thread Starter subbchtl

    (@subbchtl)

    I just updated it again. But I am not seeing any changes yet.

    Would you like my wordpress admin account details so you can help check that for me?

    dear, you can’t share your account details here

    Thread Starter subbchtl

    (@subbchtl)

    Can I share it privately. I used to have experts take a look at my website via my admin account but it is seemingly restricted now which I can understand. Let me know if there is any other way to share my details privately. Thank you

    Moderator Steve Stern (sterndata)

    (@sterndata)

    Forum Moderator & Support Team Rep

    @subbchtl Please don’t offer to send or post logon credentials on these forums:

    https://wordpress.org/support/guidelines#the-bad-stuff

    You can contact the author on their own site and, once there, the discussion is between the two of you. However, it is not OK to enter or send site credentials on these forums. We don’t want to encourage others (who are less reputable) to do similar things. It’s a fine line, but one that we need to enforce. Thanks for your cooperation.

    @yogeshyadav20 We strongly advise you NOT to accept access to user sites.

    Moderator Jan Dembowski

    (@jdembowski)

    Forum Moderator and Brute Squad

    I just want to chime in and remind users here: if anyone logs into another user’s site, even when offered, that person will be permanently banned from wordpress.org.

    https://wordpress.org/support/guidelines#the-bad-stuff

    This is a big deal and the moderators eventually find out. Do not offer to let people log into your site and if offered do not accept that invite. You will be banned when that is found out.

    Thread Starter subbchtl

    (@subbchtl)

    Noted. Thanks for clarifying. Appreciate it

    Yogesh Yadav

    (@yogeshyadav20)

    Hi @subbchtl

    @media(max-width: 480px){
    .entry-content .table-wrapper {
        overflow-x: scroll !important;
        overflow-y: hidden !important;
        white-space: nowrap !important;
    }
    }

    Appearance ->customize ->Additional CSS paste above CSS code her

    and let me know when you have done

    thanks

    Thread Starter subbchtl

    (@subbchtl)

    Thank you Yogesh. I can now see overflow X is scrollable horizontally. Thanks a ton. But the contents are overlapping now. You could check the page on your mobile as I had not changed the settings so you could take a look and help me resolve this issue. Thanks again.

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘My tables are not mobile responsive’ is closed to new replies.