Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • October 30, 2024 at 8:27 pm #1470272
    clintrichardson24

    Hello. A client’s website is having issues with the gallery on a product page. It appears that if more than a certain number of images are added, that blank spaces are added in between some photos. The client shared an image with the issue occurring on the backend, but I was only able to replicate it on the front end.

    Another support line indicated that “The images use using Order List HTML element to display and the site CSS from the Theme is trying to display as a grid of elements. For some odd reason, there are some gaps between some of the elements of the list but none in the CSS shows as the culprit.”

    October 31, 2024 at 5:14 am #1470316
    Ismael

    Hey clintrichardson24,

    Thank you for the inquiry.

    We’re not exactly sure why the spaces are appearing, but you can try this css code to fix it:

    .single-product div.product .woocommerce-product-gallery .flex-control-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
}

    Best regards,
    Ismael

    October 31, 2024 at 2:56 pm #1470350
    clintrichardson24

    That worked, thank you!

    October 31, 2024 at 3:57 pm #1470352
    Mike

    Hi,
    Glad Ismael could help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘WooCommerce Product Images Grid Error’ is closed to new replies.