htmlcsswordpressthemes

footer act different on chrome and safari on iOS


i have a website which is https://tekniksomine.com.tr/kategori/dokum-hazneler/? .The problem is while footer covers the some of the content on safari, there was no problem on chrome devtools. you can see screenshots below. how can i fix this issue? (https://i.sstatic.net/oTJUbb6A.png) (https://i.sstatic.net/FyWTBUPV.jpg)

i tried to inspect CSS but i could not find the solution


Solution

  • I've seen that the ul.products.elementor-grid.columns-3, that has the list of items, has a grid-row-gap: 1%. This is whats causing the overflow of the list. Use fixed size in px. I leave here a posts that explains a bit better than i do.

    Why does grid-gap cause an overflow?