Mobile Alignment

  • Resolved mmk175

    (@mmk175)


    3 months, 2 weeks ago

    Hi there,

    I have an issue that I am almost 100% sure I resolved with custom CSS (still on the site) a while ago but I can’t find the thread.

    The issue. I have added a filter to the linked page but when viewing on mobile the widget seems to push the content off to the right leaving a gap on the left side.

    Here you can see the CSS has fixed it.

    https://abbeygifts.co.uk/religious-badges/

    I have provided the css below.

    /* Fix spacing for product feed | 8173423-zen OP */
    ul.products-block-post-template {
    margin-left: 0;
    }
    .woocommerce ul.products li.product .button {
    margin: 1em 0 3px 0.3em;

    So why does it not work on my new page?

    Note: A lot, if not all, my pages have been built when “products beta” was within otter blocks. I think this has now changed to “Product template”.

    Any help would be greatly appreciated.

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Plugin Support Kush

    (@kushnamdev)

    @mmk175 Thank you for contacting us.

    Could you please try the following custom css on your site.

    @media screen and (max-width: 768px) {
      ul.wc-block-product-template {
        margin-left: 0;
      }

      .woocommerce ul.products li.product .button {
        margin: 1em 0 3px 0.3em;
      }
    }

    Please let us know how it goes, thank you!

Viewing 1 replies (of 1 total)
  • You must be logged in to reply to this topic.