New to the community? Start here

vertically align single product picture

I'm trying to vertically align the pictures in the single product pages but couldn't find the specific CSS on this one. (URLs provided in the internal ticket description)

Thanks in advance!

  • Nahid

    Hey Luke !
    Hope you are having a great day!

    Please try adding the following custom CSS in order to make the product image vertically aligned in it's container:

    .avada-single-product-gallery-wrapper {
    min-height: 400px;
    position: relative;
}

.woocommerce-product-gallery {
    position: static;
}

.woocommerce div.product div.images img {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}

    You can add the custom CSS in your WordPress Dashboard->Appearance->Customize->Additional CSS, your theme's (most preferably child theme's) stylesheet or a custom CSS plugin.

    Hope this helps. Please let us know if this works for you. We'll be looking forward to hearing back from you. Thanks!

    Kind regards,
    Nahid