Jump to content

Adding site-wide left margin

Recommended Posts

Hi, my site is https://wrasse-grouper-8fhf.squarespace.com/, password is squarespace.

I added custom code to show my navigation as a left sidebar. I have manually added 300px padding to my pages homepage to move content to the right side of the navigation. But it's not very practical to do manually for each page (I also have to remove the code to edit the pages).. 

Is there any way to add a left side site margin for the whole site, so that all content automatically has the right margin / padding?

Link to comment
  • Replies 11
  • Views 349
  • Created
  • Last Reply

Top Posters In This Topic

On 3/25/2023 at 1:56 PM, tuanphan said:

Hi,

It look like you figured it out?

No, I haven't.. I'm still adding the margin for each page.. Which is bothering a lot, also when editing the site. I still need to add a site-wide margin - one code that applies for the whole site.. 

Link to comment
On 3/27/2023 at 11:26 AM, charlineca said:

No, I haven't.. I'm still adding the margin for each page.. Which is bothering a lot, also when editing the site. I still need to add a site-wide margin - one code that applies for the whole site.. 

Can you share link to a page where you didn't add margin? We can check easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
12 hours ago, tuanphan said:

Hi,

This page is fine to me

image.thumb.png.b983dd25b8728735ec389e15cf577c90.png

No, it is not.. As you can see, the content is in the middle of the page, but the left side is always hidden by the sidebar.. If you scroll down to the next section, you can see the text on the left is hidden by the sidebar (photo 1), and I can also not edit my site well (photo 2).

The page content should be aligned within the space AFTER the sidebar and the right end of the page. I have marked in red where the content in your screenshot is supposed to sit.

Right now, this is the code I have added to all individual pages on my site, but it is annoying to have to do it for each page, and also does not solve the inconvenience of editing my site. I need this sort of code to apply SITE WIDE: 

section[data-section-id="64040f49c091fd5a9188af88"]{
 padding-left: 300px !important; 
  }
 

Screenshot 2023-04-03 at 19.59.53.png

Screenshot 2023-04-03 at 19.59.33.png

image.thumb.png.b983dd25b8728735ec389e15cf577c90.png

Link to comment
On 4/3/2023 at 9:32 PM, charlineca said:

No, it is not.. As you can see, the content is in the middle of the page, but the left side is always hidden by the sidebar.. If you scroll down to the next section, you can see the text on the left is hidden by the sidebar (photo 1), and I can also not edit my site well (photo 2).

The page content should be aligned within the space AFTER the sidebar and the right end of the page. I have marked in red where the content in your screenshot is supposed to sit.

Right now, this is the code I have added to all individual pages on my site, but it is annoying to have to do it for each page, and also does not solve the inconvenience of editing my site. I need this sort of code to apply SITE WIDE: 

section[data-section-id="64040f49c091fd5a9188af88"]{
 padding-left: 300px !important; 
  }
 

Screenshot 2023-04-03 at 19.59.53.png

Screenshot 2023-04-03 at 19.59.33.png

image.thumb.png.b983dd25b8728735ec389e15cf577c90.png

It is fine to me. Video

https://www.loom.com/share/5a97860f8b05454f8a18077815cf31d5

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
On 4/8/2023 at 8:16 AM, tuanphan said:

Yes, on the front end it looks fine as I am adding padding to all pages individually, but it's a huge inconvenience on the back end.. Having to enter code for each individual page and editing and adding sections is a huge inconvenience as well.

Also, on the front end it cuts off for anything that's not full browser size width.. See footer on the below. 

Screenshot 2023-04-10 at 09.45.56.png

Screenshot 2023-04-10 at 09.43.32.png

Edited by charlineca
Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.