Same picture grid size for all product - by Mohammed Al-khameri

Solved3 replies2 participantsUpdated by Rose Tyler

  • Avatar: Mohammed Al-khameri
    Mohammed Al-khameri
    Participant

    Hi
    I have UI issue in the products grid, some items have long either titles or another picture size they are getting out of lines and the grid looks like ugly. Is there an theme option or customized stying t fix it?

    Best regards

    3 Answers

    Avatar: Rose Tyler
    Rose Tyler
    Support staff

    Hello,

    I can’t see your Shop page – https://prnt.sc/yj1ujw

    Regards

    Avatar: Mohammed Al-khameri
    Mohammed Al-khameri
    Participant

    Sorry I provided you the password in the private content area

    Please contact administrator
    for this information.
    Avatar: Rose Tyler
    Rose Tyler
    Support staff

    Disable Massory via Theme options > WooCommerce > Shop > Shop page layout, and add the next code in Theme Options > Theme custom CSS:

    .main-products-loop .product, .products-loop .product, .carousel-area .product-slide .product {
        display: flex;
        justify-content: center;
    }
    .products-loop .ajax-content, .products-loop {
        display: flex;
        flex-wrap: wrap;
        flex: 1;
    }
    .content-product {
        flex-direction: column;
        justify-content: space-between;
        display: flex;
        flex: 1;
    }
    .content-product .quantity-wrapper {
        margin-right: auto;
        margin-left: auto;
    }
    .swiper-container {
        display: flex;
        align-items: stretch;
    }
    .product-slide .product {
        display: flex;
        height: 100%;
    }
    .swiper-wrapper {
        height: auto;
    }

    Regards

The issue related to '‘same picture grid size for all product’' has been successfully resolved, and the topic is now closed for further responses