Newbie Question - how can I add padding/margin to my collection description?

Solved
bmdevv
Tourist
3 0 1

Hi there, 

I am new to Shopify and I have what I am sure is a very basic newbie question. I just added the collection description code so it now shows on the collection page. However I would like to edit the code so text doesn't span the full width of the page. Would some one be able to suggest how I can edit this code to account for that? 

This is what I have. I am just not sure how to edit it to add padding/margin to just the description.  

<div id="colect-descr">{{ collection.description }}</div>

Thank you! 

 

0 Likes
iDoThemes
Excursionist
35 10 21

To your main CSS file (probably theme.scss.liquid or similar) you'd add something like:

#colect-descr {
  padding: 5px;
  margin-top: 5px;
}

 

Developer of Liquify Chrome Extension -- Enhance the Shopify Theme Code Editor

Theme Developer -- Drop me a line

Hello @bmdevv,

Please share:
- your store URL;
- page URL with the issue you mention;
- storefront password (if your store has one).

If the store is not online yet, please follow this quick tutorial to learn how to safely and temporarily share an offline/unpublished theme URL.

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ How to add a slider & thumbnails to product page images: Minimal theme | Debut theme | Brooklyn theme
◦ Replace apps with simple copy/paste code snippets. Examples clicking here.
0 Likes
bmdevv
Tourist
3 0 1

Hi Diego, 

The store is thegoodlane.myshopify.com - the page I would like to add the margin on is: https://www.thegoodlane.com/collections/subscription-box 

Thanks for your help! 

LitExtension
Shopify Partner
871 99 158

This is an accepted solution.

Hi @bmdevv,

Please follow the steps:

- Step 1: Go to Online store > Themes > Actions > Edit code.

- Step 2: Go to Asset > theme.min.css.liquid and paste this at the bottom of the file:

#colect-descr{

    padding: 0px 15px 15px 15px;

}

Please refer this code here: https://www.w3schools.com/css/css_padding.asp

Hope this helps! 

LitExtension - Shopping Cart Migration Expert
If our answer is helpful then please accept as solution!
Are you looking for a solution to migrate to Shopify? Contact us for further assistance.
Try our FREE DEMO now!
bmdevv
Tourist
3 0 1

@LitExtension that worked - thank you so much! 

0 Likes