Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #955185

    I’m using the table widget with the following options:
    – Use the table to display tabular data
    – Minimal
    – Adjust table to screen size

    On Desktop it is displaying correct
    But on the Mobile it is not displaying all the headings?
    How do I get it to display all the headings on the mobile please?

    • This topic was modified 6 years, 7 months ago by johanndm.
    #955395

    Hey Johann,

    Please provide a link to the site/page in question so we can look into this issue further.

    Best regards,
    Jordan Shannon

    #955419

    Hi Jordan,

    Here you go :-)

    Thanks

    #955422

    Hi,

    Thanks for sending the link, but I’m not seeing the exact section provided in the screenshot. Perhaps the translation is different?

    Best regards,
    Jordan Shannon

    #955429

    Hello Jordan,

    Apologies – here’s the English link – it’s the 2nd table on the page.

    Thanks
    Johann

    #955431

    Hi,

    That’s incredibly odd. I’m not even seeing a row anywhere in the area you highlighted. It seems that there is no heading even there in the code.

    Best regards,
    Jordan Shannon

    #955432

    Hello Jordan,

    Yes I did some debug via UB on the mobile and I spotted that it doesn’t bring the :before over the the <td> lines, but strange the first table on the page is exactly the same, apart from the fact that it has 1 less column – so perhaps there’s something in the backend code that goes weird based on more than x columns?

    Also more strange, is if I shrink my browser page to mobile size it looks fine – it’s just when I check it on the actual mobile that it’s not working… Beats me!!

    Thanks
    Johann

    #955463

    Hi,

    Let me check with a few other mods for additional feedback.

    Best regards,
    Jordan Shannon

    #955550

    Hi!

    The html is laid out in such a way that the headers are going to be a separate block on top, not in every cell line you want
    Image 2018-05-12 at 12.34.11.png

    This is why they are hidden in mobile.
    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
    @media only screen and (max-width: 767px) {
        .responsive .avia_responsive_table .avia-data-table .avia-button-row, 
        .responsive .avia_responsive_table .avia-data-table tr:first-child th {
            display: block;
        }
    }

    If you need further assistance please let us know.
    Regards,
    Victoria

    #964829

    Hello Victoria,

    Apologies for the delayed response :-)

    I have added the css and it works perfect now thank you!!

    Thanks for the help!

    #964857

    Hi,

    I’m glad you got this corrected. If you need additional help, please let us know here in the forums.

    Best regards,
    Jordan Shannon

Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘Table on mobile – not showing all headings’ is closed to new replies.