Deleter margin on product page

AirBelInd
New Member
6 0 0

Hi, anyone know how i could remove these borders ?

url : https://juicersmoothie.com/products/smooth-by-juicer

242903891_442700613823860_5751955233058836420_n.jpg

 

Thanks for your response 

0 Likes
PaulNewton
Shopify Partner
3131 195 576

Always backup your theme before making changes

Add the following untested CSS code to your themes css  file or custom css file,

This will override the current max of 1200px, you will want to review your theme across different browser, and screen sizes for potential issues.

Also simply consider leaving the design alone and letting it breath with whitespace as it was intended and avoid a future where your website looks "cramped".

 

 

.grid {
    width: 100%;
    max-width: 100%;
    max-width: 100vw;
    margin: 0 auto;
}

 

 

 

Problem Solved? ✔️Accept and ? Like the solution so you can help others.
Buy me a coffee ☕ paypal.me/paulnewton or donate to eff.org
Confused? Busy? Buy a custom solution paull.newton+shopifyforum@gmail.com
0 Likes
AirBelInd
New Member
6 0 0

thanks for your answer, in which file should i put this piece of code?

0 Likes
PaulNewton
Shopify Partner
3131 195 576

@AirBelInd wrote:

thanks for your answer, in which file should i put this piece of code?


 

code to your themes css  file or custom css file


This will vary wildly be theme especially for an unsupported unofficial third party theme from a place like themeforest

Problem Solved? ✔️Accept and ? Like the solution so you can help others.
Buy me a coffee ☕ paypal.me/paulnewton or donate to eff.org
Confused? Busy? Buy a custom solution paull.newton+shopifyforum@gmail.com
0 Likes
AirBelInd
New Member
6 0 0

it doesn't work, nothing happens, I use fastlane as a theme

0 Likes
PaulNewton
Shopify Partner
3131 195 576

There was a typo missing a dot( . ) signifying it's a CSS class selector

Try again , if it doesn't work be specific in steps you have taken.

.grid {
    width: 100%;
    max-width: 100%;
    max-width: 100vw;
    margin: 0 auto;
}

 

Problem Solved? ✔️Accept and ? Like the solution so you can help others.
Buy me a coffee ☕ paypal.me/paulnewton or donate to eff.org
Confused? Busy? Buy a custom solution paull.newton+shopifyforum@gmail.com
0 Likes
AirBelInd
New Member
6 0 0

it still doesn't work, i put the code in theme.scss.liquid and nothing changes, i don't have a custom css file.

0 Likes
PaulNewton
Shopify Partner
3131 195 576

Check for a styles.css etc your looking for .css files that control your main styles.

Goodluck.

Problem Solved? ✔️Accept and ? Like the solution so you can help others.
Buy me a coffee ☕ paypal.me/paulnewton or donate to eff.org
Confused? Busy? Buy a custom solution paull.newton+shopifyforum@gmail.com
0 Likes
AirBelInd
New Member
6 0 0

thank you very much it works, there are two more that I would like to delete, at the top as well as on the right (as in the screenshot). Is it possible?

0 Likes
PaulNewton
Shopify Partner
3131 195 576

The "top" is actually part of the breadcrumb look in your css file for 

.breadcrumb_wrap

or override it later in the file with

.breadcrumb_wrap {
 margin-bottom: 10px;
}

 

As for the The rest of the left and right side "margin" is from the various internal elements and you'd have to start making a lot of similar advanced changes and overrides. Goodluck.

Problem Solved? ✔️Accept and ? Like the solution so you can help others.
Buy me a coffee ☕ paypal.me/paulnewton or donate to eff.org
Confused? Busy? Buy a custom solution paull.newton+shopifyforum@gmail.com
0 Likes