Removing white spaces from product photos - Brooklyn Theme

Highlighted
New Member
3 0 0

Hi folks, 

 

I can't figure out why my product photos are bordered with white spaces. I'm trying to get rid of them. They are wider on mobile for some reason. 

 

Any tips? 

 

https://www.aglowcandleco.com/collections/all

0 Likes
Highlighted
Shopify Expert
2732 468 602

Hi @aziggs 

Follow this:

1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste bellow code in bottom of file

 

@media screen and (max-width: 590px){.product--wrapper { margin: 0 auto; }}

 

 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
Highlighted
New Member
3 0 0

Hi @Jasoliya 

 

That helped remove the white space on mobile - THANK YOU! But on Desktop, some of my images have a small sliver of white banner underneath them still. 

 

https://www.aglowcandleco.com/collections/classic-collection

 

The second and third row, starting with rosemary sage. It feels buggy because when you hover your mouse over it the white space momentarily disappears (then comes back). Any idea how to fix that? 

0 Likes
Shopify Expert
2732 468 602

ok, no worry, can you send me screenshot so i can get idea because on my screen i cant find due to different screen 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes
Highlighted
New Member
3 0 0

Hi @Jasoliya 

 

Sure thing! Attached is a screenshot of what I'm talking about. Some of the product images have a thin white space beneath them, others dont. Screen Shot 2019-07-08 at 2.54.01 PM.png

 

Also, there's a strange issue when you scroll on https://www.aglowcandleco.com/pages/our-candles on a mobile device. A small white bar appears at the bottom of the scroll and then disappears. Seems kind of buggy. Is there a way to make that scrolling white bar disappear too? 

0 Likes
Highlighted
Shopify Expert
2732 468 602

That's not white border but in some screen image will adjust portion that's why image reduce size base on screen and you can see white padding behind this, for that may be need to change some image code.

For white scrolling bar  issue you have wrong css added for images so need to correct it:

1. Add this css at bottom  in Asset->theme.scss

 

.p1 b img{ max-width: 100%;    margin-left: 0%;}

 

 

Want to modify or custom changes on store hire me.
If helpful then please Like and Accept Solution.
Email: jasoliyabrijesh123@gmail.com
Skype: jasoliya.brijesh
Want to get Free review and advice for sale on store ?? just text me here
0 Likes