FROM CACHE - en_header

Dawn theme | product page - how to add padding to the entire left side?

Solved
thelunalee
Tourist
11 1 1

Hi,

I'm wanting to move everything over a little bit to the left on my product pages.

This is so that it's more in the centre but still left aligned (text).

 

Here is the preview link:

https://bfpmmytfdcs7ysgl-27058765902.shopifypreview.com

Accepted Solutions (2)

Accepted Solutions
diego_ezfy
Shopify Partner
2809 531 744

This is an accepted solution.

@thelunalee,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:

<style>@media (min-width: 750px){
    .product-section .product {
    padding-left: 100px;
}
}</style>


You can change the 100px to any value you wish. This will not take effect on mobile devices.

Kind regards,
Diego

 

View solution in original post

dmwwebartisan
Shopify Partner
11139 2393 3433

This is an accepted solution.

 

@thelunalee 

Try this new code 

Add code Your assets/section-main-product.css bottom of the file.

@media screen and (min-width: 990px) {
.product:not(.product--no-media):not(.featured-product) .product__media-wrapper { max-width: 35% !important;}
.product {
    margin: 0 auto;
    justify-content: center;
}
}

 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Click here GemPages The most powerful Shopify page builder.

View solution in original post

Replies 9 (9)
diego_ezfy
Shopify Partner
2809 531 744

This is an accepted solution.

@thelunalee,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. In your theme.liquid file, find the </body> (press CTRL + F or command + F on Mac)
3. paste this code right above the </body> tag:

<style>@media (min-width: 750px){
    .product-section .product {
    padding-left: 100px;
}
}</style>


You can change the 100px to any value you wish. This will not take effect on mobile devices.

Kind regards,
Diego

 

thelunalee
Tourist
11 1 1
dmwwebartisan
Shopify Partner
11139 2393 3433

@thelunalee 

Add code Your assets/section-main-product.css bottom of the file.

@media screen and (min-width: 990px) {
.product:not(.product--no-media):not(.featured-product) .product__media-wrapper { max-width: 35% !important;}
product {
    margin: 0 auto;
    justify-content: center;
}
}

Thanks!

 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Click here GemPages The most powerful Shopify page builder.
thelunalee
Tourist
11 1 1

@dmwwebartisan 

Hi, 

I couldn't get it to work, I think I may be pasting the code in the wrong place?

 

 

dmwwebartisan
Shopify Partner
11139 2393 3433

This is an accepted solution.

 

@thelunalee 

Try this new code 

Add code Your assets/section-main-product.css bottom of the file.

@media screen and (min-width: 990px) {
.product:not(.product--no-media):not(.featured-product) .product__media-wrapper { max-width: 35% !important;}
.product {
    margin: 0 auto;
    justify-content: center;
}
}

 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Click here GemPages The most powerful Shopify page builder.
bbqvilla
New Member
2 0 0

how to add padding to the entire left side?

Use This Code...

@media screen and (min-width: 990px) {
.product:not(.product--no-media):not(.featured-product) .product_media-wrapper { max-width: 35% !important;}
product {
    margin: 0 auto;
    justify-content: center;
}
}

 

thelunalee
Tourist
11 1 1
dmwwebartisan
Shopify Partner
11139 2393 3433

@bbqvilla 

Please share screenshot what do you want!

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Click here GemPages The most powerful Shopify page builder.
Nickoleo
New Member
4 0 0

Hello could you help me?

Heated Jacket – WintertimeWonder

Password is 123.

I would like to make margins on the sides, as you can see it is right on the border. 
Thanks