Hallo,
ich benötige bitte Hilfe bei meinem Tabellen Problem auf der mobilen Version. ;-)
Auf der Startseite von https://einkornmehl-kaufen.de/ wird die zweite Tabelle korrekt über die volle Breite angezeigt. So ist sie perfekt.
Die Tabelle auf https://einkornmehl-kaufen.de/unterschied-einkornmehl-hell-vs-vollkorn/ über den Viewport der Seite geht und teilweise der Content abgeschnitten wird.
Woran liegt das denn und wie kann ich es lösen? :-)
Vielen Dank für eine Antwort.
Alex
____________________________
Hello,
I need help with my table problem please on mobil version. ;-)
On the homepage of https://einkornmehl-kaufen.de/ the second table is displayed correctly over the full width. She’s perfect like that
The table on https://einkornmehl-kaufen.de/vergleich-einkornmehl-hell-vs-vollkorn/ goes over the viewport of the page above and some of the content is cut off.
Why is this and how can I solve it? :-)
Thank you for an answer.
Alex
Hey Alex,
Thank you for the inquiry.
The second page doesn’t exist. Did you remove it? Please create a test page so that we can check the issue properly.
Best regards,
Ismael
Hello and sorry. My mistake. The page is: https://einkornmehl-kaufen.de/unterschied-einkornmehl-hell-vs-vollkorn/
The table under points 1, 2 and 4 is cut off to the right on mobile (iphone 12). It is displayed correctly again under points 3 and 5.
Hi,
Thank you for the inquiry.
Please edit all the Text Blocks with the table element, go to Advanced > Developer Settings panel, apply the name “av-custom-text-table” in the Custom CSS Class field, then add this css code to make the tables scrollable in mobile view.
.av-custom-text-table {
overflow: auto;
}
Best regards,
Ismael
thanks for the input. Thanks to that it has led me to this solution
table {
table-layout: fixed;
width: 100%;
}
td, th {
font-size: min(16px, 3vw);
}
td, th {
padding: 8px;
border: 1px solid #ddd;
}
now it works great. Thanks again.