Left padding for Rich Text section or column? - Highlight Theme

Solved
Hannaht2
New Member
7 0 0

Trying to add left padding to a rich text section on my Highlight theme. 

 

I added this CSS to the id section:

padding-left: 50%; 

 

Whilst it gives the section padding, it only moves it over, making the whole site width longer. 

Not sure what additional CSS I need to add in, or if I should be using columns instead?

 

First image for context on how the CSS makes the site width larger, second image is how it should look. 

 

Pls help!

 

Site URl: https://soundlab-melbourne.myshopify.com/admin/themes/131822256370/editor?previewPath=%2Fpages%2Fspe...

 

 

 

 

 

 

Accepted Solution (1)

Accepted Solutions
kazi
Shopify Partner
325 64 66

This is an accepted solution.

Then use this css instead the previous one

 

@media (min-width:768px) {

#shopify-section-template--15985039868146__164863221804800728 .rich-text-blocks {
padding-left: 30%;
}

}

☑️ If the answer solve your issue please ✔ Accept it and hit like ✌️

► Need help with theme customization, speed optimization, fix bugs?


► Email: Click here Skype: kof.bd

View solution in original post

Replies 9 (9)
kazi
Shopify Partner
325 64 66

Hello @Hannaht2  site is password protected

☑️ If the answer solve your issue please ✔ Accept it and hit like ✌️

► Need help with theme customization, speed optimization, fix bugs?


► Email: Click here Skype: kof.bd
Hannaht2
New Member
7 0 0

@kazi Password is: thesoundlabmelbourne

 

Thank you!!

 

kazi
Shopify Partner
325 64 66

Which section do you mean?

☑️ If the answer solve your issue please ✔ Accept it and hit like ✌️

► Need help with theme customization, speed optimization, fix bugs?


► Email: Click here Skype: kof.bd
Hannaht2
New Member
7 0 0

@kazi 

 

The rich text section, image for context below 

 

 

How it should lookHow it should lookHow it looks with padding-left: 50%; addedHow it looks with padding-left: 50%; added

 

 

kazi
Shopify Partner
325 64 66

which page is that? can u send the link?

☑️ If the answer solve your issue please ✔ Accept it and hit like ✌️

► Need help with theme customization, speed optimization, fix bugs?


► Email: Click here Skype: kof.bd
kazi
Shopify Partner
325 64 66

Add this css on assets > theme.css bottom of file

 

#shopify-section-template--15985039868146__164863221804800728 .rich-text-blocks {
padding-left: 30%;
}

☑️ If the answer solve your issue please ✔ Accept it and hit like ✌️

► Need help with theme customization, speed optimization, fix bugs?


► Email: Click here Skype: kof.bd
Hannaht2
New Member
7 0 0

@kazi 

 

Thank you so much!!!

 

How do I remove the padding for mobile?

kazi
Shopify Partner
325 64 66

This is an accepted solution.

Then use this css instead the previous one

 

@media (min-width:768px) {

#shopify-section-template--15985039868146__164863221804800728 .rich-text-blocks {
padding-left: 30%;
}

}

☑️ If the answer solve your issue please ✔ Accept it and hit like ✌️

► Need help with theme customization, speed optimization, fix bugs?


► Email: Click here Skype: kof.bd