Re: Symmetry Theme - How to add margin to product description on product page

Solved

Symmetry Theme - How to add margin to product description on product page

User1057422
Tourist
6 0 3

Hello, I am trying to add a margin to the left side of the product description in symmetry theme because it is currently in line with the edge of the screen. I have tried using the following code in the style.css.liquid asset but it doesn't work. 

 

 

.product-description-container{
padding-left: 50px;
padding-right: 50px;
}

 

 

Site url is: houseofdudley.com

 

See example of product description here: https://www.houseofdudley.com/collections/garden/products/black-herb-scissors-set-3

 

Any help is much appreciated, thanks.

Accepted Solutions (2)

GemPages
Shopify Partner
5621 1261 1230

This is an accepted solution.

Hello @User1057422 

 

It's GemPages support team and glad to support you today.

You can follow these steps:

1. Go to Online Store -> Theme -> Edit code
2. Open your theme.liquid theme file
3. Paste below code before </body> :

 

<style>
     #shopify-section-product-template .description{
         padding: 0 50px;
      }
</style>

 

If you require any further information, feel free to contact me.
Best regards,
GemPages Support Team

 

 

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center

View solution in original post

themehelper
Excursionist
15 3 4

This is an accepted solution.

@User1057422 
Add This code to

.desktop-only {
    margin-left: 50px !important;
}

the bottom of the style.CSS file.
Thank You.
 

View solution in original post

Replies 5 (5)

GemPages
Shopify Partner
5621 1261 1230

This is an accepted solution.

Hello @User1057422 

 

It's GemPages support team and glad to support you today.

You can follow these steps:

1. Go to Online Store -> Theme -> Edit code
2. Open your theme.liquid theme file
3. Paste below code before </body> :

 

<style>
     #shopify-section-product-template .description{
         padding: 0 50px;
      }
</style>

 

If you require any further information, feel free to contact me.
Best regards,
GemPages Support Team

 

 

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center
User1057422
Tourist
6 0 3

Thank you so much @GemPages , it worked! However, now the social icons are not in line with the description as shown: https://www.houseofdudley.com/collections/decor-2/products/aluminium-and-enamel-condiment-bowls-with...

 

How could I fix this?

themehelper
Excursionist
15 3 4

This is an accepted solution.

@User1057422 
Add This code to

.desktop-only {
    margin-left: 50px !important;
}

the bottom of the style.CSS file.
Thank You.
 

User1057422
Tourist
6 0 3

@themehelper 

 

Thank you for your help, works great!

themehelper
Excursionist
15 3 4

@User1057422 
Welcome.