How to add grid to the product photos

[mashiaq]

How to add grid ( lines to separate) to the product photos like the picture attached?

Attachments:

You must be logged in to view attached files.

[Harry]

Hi,

Please add below code to Theme Settings > Custom Code > Custom CSS

.products [class*="jas-col-"] {
border-right: 1px solid #ddd;
border-top: 1px solid #ddd;
}
.products [class*="jas-col-"]:nth-child(1),
.products [class*="jas-col-"]:nth-child(2),
.products [class*="jas-col-"]:nth-child(3),
.template-index .products [class*="jas-col-"]:nth-child(4) {
border-top: none;
}
.products [class*="jas-col-"]:nth-child(3n),
.template-index .products [class*="jas-col-"]:nth-child(4n) {
border-right: none;
}
.template-index .products [class*="jas-col-"]:nth-child(3n) {
border-right: 1px solid #ddd;
}

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[mashiaq]

Super ! Thanks Harry

[Harry]

You’re welcome.

Hope you love our theme and support and consider give our theme 5 stars rating and good review at https://themeforest.net/downloads

Thank and have a nice day!

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Author]

Posts