Make Woocommerce single product page image round shape with border
September 16, 2017 Leave a comment
This is a simple css trick to make your woocommerce single product page to be round shape with a border. Use the code below in your custom css portion.
If you face any issue feel free to take help in the comments section.
.woocommerce-product-gallery__image img { border-bottom-left-radius: 50% 50% !important; border-top-left-radius: 50% 50% !important; border-top-right-radius: 50% 50%; border-bottom-right-radius: 50% 50%; border-bottom-left-radius: 50% 50% !important; height:382px !IMPORTANT; border: 5px solid #f5f5f5 !important; } .woocommerce-product-gallery__image { width: 382px !IMPORTANT; } .woocommerce div.product div.images li img { border: none !important; transition: opacity .5s ease; border-radius: none !important; height: auto !important; }
Recent Comments