How to add permanent border around products in Grid view

Last updated

To add a border around your products in Grid view add the following code to your custom CSS theme:

/* Add the border and background to the product thumbnails */
div.ecwid-productBrowser-productsGrid .ecwid-productBrowser-productsGrid-cellTop {
background: #FFF !important;
border-top: 2px solid #993535;
border-right: 2px solid #993535;
border-left: 2px solid #993535;
padding-top: 10px !important;
}
div.ecwid-productBrowser-productsGrid .ecwid-productBrowser-productsGrid-cellMiddle {
background: #FFF;
border-right: 2px solid #993535;
border-left: 2px solid #993535;
}
div.ecwid-productBrowser-productsGrid .ecwid-productBrowser-productsGrid-cellBottom {
background: #FFF;
border-right: 2px solid #993535;
border-bottom: 2px solid #993535;
border-left: 2px solid #993535;
padding-bottom: 10px;
}

To add border around category thumbnails in category grid, please use this code:

table.ecwid-productBrowser-subcategories-mainTable a > img {
  border-style: solid !important;
  border: 2px solid #D8D8D8;
}
Back to top
Was this article helpful? 2 out of 9 found this helpful