Solved

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

Hannaht2
Excursionist
16 0 3

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)
kazi
Shopify Partner
543 85 105

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 ?


WhatsApp Email: Click here Skype: kof.bd

View solution in original post

Replies 9 (9)

kazi
Shopify Partner
543 85 105

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 ?


WhatsApp Email: Click here Skype: kof.bd
Hannaht2
Excursionist
16 0 3

@kazi Password is: thesoundlabmelbourne

 

Thank you!!

 

kazi
Shopify Partner
543 85 105

Which section do you mean?

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

► Need help with THEME CUSTOMIZATION, SPEED OPTIMIZATION ?


WhatsApp Email: Click here Skype: kof.bd
Hannaht2
Excursionist
16 0 3

@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
543 85 105

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 ?


WhatsApp Email: Click here Skype: kof.bd
kazi
Shopify Partner
543 85 105

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 ?


WhatsApp Email: Click here Skype: kof.bd
Hannaht2
Excursionist
16 0 3

@kazi 

 

Thank you so much!!!

 

How do I remove the padding for mobile?

kazi
Shopify Partner
543 85 105

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 ?


WhatsApp Email: Click here Skype: kof.bd