-
Posts
-
Hello,
When I view tables (made with the Avia layout builder) on mobile devices, the table headers are in the wrong place. Here is what the tables look like normally:
This is what it looks like on a mobile device (the image has been spliced together):
The header titles seems to have shifted. You don’t even see the first column header (Product) on the mobile device.
Is there anything I can do to fix this?
Hi,
I just tried that and now there are some text wrapping issues on Mobile:
(Image spliced together from 3 images)Any suggestions? I like both ways of displaying data (I prefer the first) but these issues are unfortunate.
Edit : Wrong one.
Here it is : http://www.allbarcodesystems.com/products/barcode-scanners/
The first table has scrolling turned on. The rest do not.
Hi!
It’s happening because you have this code in your css/custom.css file:
.avia-data-table .avia-features-col{ max-width: 585px; }Try removing it.
Regards,
JosueHi Josue,
I need to keep the width for design choices for desktop. Is there anything I can do to keep the width for desktops but change for mobile?
Sure, change it to:
@media only screen and (min-width: 768px) { .avia-data-table .avia-features-col{ max-width: 585px; } }Regards,
Josue
Change it to this, so it only gets applied when viewed in desktop:
@media only screen and (min-width: 768px) { .avia-data-table .avia-features-col{ max-width: 585px; } }Cheers!
Josue
- You must be logged in to reply to this topic.