Jump to content

Changing Summary Block Spacing

Recommended Posts

I'm working on formatting a summary block (list layout) on the Anya (Bedford) template, and I ran into a snag. I'm trying to reduce the space between items (in this case, titles, because I'm not using anything else), and I used the following CSS:


.summary-block .summary-item {
 margin-top: -30px !important;
}

.summary-block{
 margin-bottom:-30px !important;
}

When I had the custom CSS window open, everything looked exactly like I wanted it to. Then I saved it and refreshed the page, and they're showing up far apart again. The code is still there.

Any advice? (For what it's worth, I tried it both with and without the !important.)

http://livingspiritumc.org/sample-blog

Link to comment
  • 7 months later...
  • Replies 3
  • Views 3.5k
  • Created
  • Last Reply

AQP, I'm not sure if this will work, but here's what I did: 

.summary-item {
 margin-top: -30px !important;
}

Deleting the rest of the code you wrote and using just what's above worked for me, both in the custom CSS window and after I saved.

(For what it's worth, I know very little about CSS, and in fact used your code to edit the spacing on my site. I tinkered with it until I arrived at only the code that made a difference.)

Hope that helps. Thanks again for posting your code. 

EDIT: I did some more tinkering, because I wanted to shrink the margin at the bottom of the summary block, and here's what worked for me:

.sqs-block-summary-v2 {
  margin-bottom: -40px !important;
}

I then consolidated the two, because why not (I don't know if this is how you're supposed to organize CSS, but it seemed logical) : 

.sqs-block-summary-v2 {
.summary-item {
  margin-top: -10px !important;
}
  margin-bottom: -40px !important;
}

It still works in both the custom CSS window and after save. Again, hope that helps. 👍

Link to comment
  • 1 year later...
On 10/29/2021 at 5:36 AM, JohnMillea said:

I've tried to use this code, but I have a border, and it doesn't shrink with the margin. Is there a way to actually change the size of the block? I really want to get rid of that white space at the bottom.

Can you share link to your site? 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

Archived

This topic is now archived and is closed to further replies.


×
×
  • 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.