Hi There!

Sorry for the inconvenience.

Got the behavior at my end. However, the following code in your custom CSS might be helpful in this case:

@media only screen and (max-width: 568px) {
    .sppb-no-table-header tbody tr:first-child {
        display: block !important;
    }
}

Here is all about custom code placement in Helix Ultimate: https://www.joomshaper.com/documentation/helix-framework/custom-code-css-js-meta

Best regards,

Hi Rashida, I put the code in helix in the custom code before </head but the result is a very small image and the table design is broken on the iphone in portrait mode! means the colums are not matching. I can send you a screenshot if you like, but I didn't found an upload icon

Okay, here you can find the screenshot of my iPhone in portrait view:

https://www.will-cassel.de/images/iPhone_Screenshot.jpg

Below "Links" you can find the image of Krefeld (see also two rows below) in a very small size and the text is nearly in the same columns. The other entries are looking very well, only the first row is in a bad condition. You can see it also online here: https://www.will-cassel.de/en/links with a smartphone in portrait. The problemis gone, removing the CSS code and using pagination like this https://www.will-cassel.de/de/links

Hi,

Thanks for the details.

In your case the code should be this instead of the previous snippet:

@media only screen and (max-width: 568px) {
    .sppb-no-table-header tbody tr:first-child {
        display: table-row !important;
    }
}

Please let me know the update.

Note: You need to put the code in the custom CSS field of your template options.

Best regards,

Hello,

Hope you are doing well. Did you check my last reply?

Thanks!

Hello, sorry for my delay, but I spent some holidays. Now I tested your code and it seems, it works fine. Thanks!

Hi,

No issues:) Glad that it helps!

You may accept the most useful answer in order to close the post...

Have a nice day!