Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
Sign in to follow this  
Omario

How can I reduce spaces/padding?

Question

How would I reduce the gap between these two areas (in the screenshot)?

How can I reduce this white space?

I can’t find the correct CSS to help me. I tried to make the padding around the horizontal line smaller, but for some reason it only takes the padding away from the top of the line.

And I can’t find a way to reduce the padding above and below the text block, at least without ruining the text on everything else on the page.

Really would be a big help if someone knew how to fix my problem!

Edited by racheldc

Share this post


Link to post

4 answers to this question

Recommended Posts

  • 0

I'm not a Squarespace or CSS expert by any means, however I've been relentlessly playing with padding to tighten up my webpage.

The following have worked for me - you'll have to play with the values (yes, it's tedious!):


/*Padding on Horizontal Rules (Lines)*/

.sqs-block-horizontalrule hr {
  margin-top: -10px;
    margin-bottom: -10px;
}

/*Padding on Code Blocks*/

.sqs-block-code {
 padding-top: 0px;
 padding-bottom: 0px
}

/*Padding on Text Blocks*/

.sqs-block-html {
 padding-top: 5px;
 padding-bottom: 5px;
}

A catch all padding reduction strategy seems to be:


.sqs-block {
margin-top: -5px;
margin-bottom: -5px;
 padding-top: 0px;
 padding-bottom: 0px;
}

But for some reason that did not work on horizontal rules, and only sometimes on text blocks - hence the multitude of padding related code above.

I have not tested this across devices yet - and to be honest am somewhat worried that I'm ruining the aesthetics and functionality of the site! Haha!

So far, the above has helped though.

Good luck!

Share this post


Link to post

Create an account or sign in to comment

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

Sign in to follow this  

×
×
  • Create New...