[Resolved] Menu arrows and mobile spacing on archive pages

[Joy]

Amazing Tom, thank you, that seems to have sorted out the iPad Pro view. Though the iPad and iPhone view still have slightly too much space on the RHS. Wondering if I now have too much overlapping code trying to fix the issue?

Many thanks again,
Joy

[Tom]

Hmm, not sure I’m seeing it – can you show me a screenshot of what you’re seeing?

[Joy]

Thanks Tom, I’ve added a link in the private section with a few snapshots – now also including the home page which we’ve just switched from Elementor to Genenerate Blocks + Gutenberg and is having the same issue.

[Tom]

Try changing this CSS:

.wp-block-latest-posts.is-grid {
    margin-left: -20px;
}

To this:

.wp-block-latest-posts.is-grid {
    margin-left: -20px;
    max-width: none;
}

Let me know 🙂

[Joy]

Thanks Tom, getting close now! 🙂

This sorted out the issue on mobile which is awesome. The category page (added the link to the private section) is still showing wonky on ipad which is less of a major issue but I suppose I should sort it out. Any advice appreciated!

[Tom]

Not sure I’m seeing any issues there – what should I be looking for?

Let me know 🙂

[Joy]

Including a link to an image in the private section and the link to the actual page. This is the ipad view using developer tools.

Does that clarify?

Many thanks,
joy

[Tom]

Perfect. I believe that’s being caused by this CSS: https://generatepress.com/forums/topic/menu-arrows-and-mobile-spacing-on-archive-pages/#post-1381483

If you remove that, does it fix the issue, and does it introduce any other issues?

[Joy]

Solved!! Amazing thanks so much Tom, much appreciated.

[Tom]

Glad I could help 🙂

[Author]

Posts