Big Cartel Theme Support

How do I change the spacing between product image thumbnails?

How do I change the spacing between product image thumbnails?

To edit the spacing between product image thumbnails, navigate to your custom style coding area — see Where do I add custom style code? — and add the following CSS as required.

Adjusting vertical spacing

The pixel value entered in this CSS must be exactly the same whole number — in this example we use 14immediately followed with px

For the margins — the first style group below — the value must be made negative by adding a - immediately in front of the value.

/* Adjust product thumbnail vertical spacing */
.products.grid > .inner {
    margin-right: -14px;
    margin-left: -14px;
}
.product.tile {
    padding-right: 14px;
    padding-left: 14px;
}

Adjusting horizontal spacing

Here we can use any whole number immediately followed with px

/* Adjust product thumbnail horizontal spacing */
.product.tile {
    padding-bottom: 20px;
}

AarcadeHow do I change the spacing between product image thumbnails?