decrease the space between product photos

[rawandrefine]

i am looking for a way to decrease the gap between products so the photos are bigger and closer together

tried a few codes and nothing has worked yet

the url is https://rawandrefine.com/collections/tumble-stones-rough

i also tried a test collection where all pics were the exact same size and the gap was still there

can anyone help please?

the theme is narrative so theme.scss.liquid not css 

[Artzen_tech]

Hello @rawandrefine 

Its Artzen Technologies! We will be happy to help you today.

1.   Go to online store > theme > Edit code > Assets > base.css (file) and  Paste the below code at bottom of the file -> Save  

.card__image-wrapper--aligned .card__image--align{
    object-fit: cover;
}

 

Let me know if need further assistance

Regards,

Artzen Technologies

[rawandrefine]

Hi

base.css is not an option under assets 

[oscprofessional]

@rawandrefine 

check theme.css

[Artzen_tech]

theme.scss  

paste here

[rawandrefine]

i still want them 540 x 720 px - is this possible please?

[Artzen_tech]

Sorry,  @rawandrefine

Your image doesn't have enough space to show on this (540 x 720)pixel because you have taken max-width:980px.

Let me know if need further assistance

Regards,

Artzen Technologies

[rawandrefine]

i saved the images as 540 x 720

can you confirm what i need to do please?

[rawandrefine]

hello? can you confirm what i need to do please as the images im uploading are 540 x 720 

thanks

[oscprofessional]

@rawandrefine 

img.card__image.card__image--align.fade-in.lazyautosizes.lazyloaded {
    object-fit: cover;
}

Add this css at the bottom of Online Store->Theme->Edit code->Assets->theme.scss.liquid

[rawandrefine]

This did work but the pictures have now gone square, i still want them 540 x 720 px - is this possible please?

[OmeerEco]

Just remove the position relative like attacked: