Jump to content

Adjusting "Title Separation" for stacked text image block,

Recommended Posts

Posted

Hello I am having a hard time maintaining consistency within various types of text+image layouts. For instance I prefer a spacing between titles and paragraph text for various layouts.

With card image blocks I am able to tighten the "title separation" for an ideal spacing, but with text above images I am unable to change the padding causing mismatched text spacing.

 

for example 1481384136_ScreenShot2020-12-21at12_35_50PM.thumb.png.08a5fed97b234c6c0e65943eca4cbe90.png

 

"Creating a Cohesive Brand" is much tighter to the paragraph below, where as animating assets is stuck in the default.

The only place I have been able to tighten the spacing has been Design> Fonts> Headings> Line Height, but then when viewed on mobile the same type just becomes an overlapping mess. 

 

Another side issue is when trying to format paragraph text to monospace, only certain image blocks seem to show show the correct monospace style. 

1022780195_ScreenShot2020-12-21at12_43_42PM.thumb.png.1ddd9befbbf31a2308165ea385db05b5.png

versus trying to do it with a centered text option

123263272_ScreenShot2020-12-21at12_42_24PM.thumb.png.67a76744eba3c62fa7f65cbc011741da.png

-

 

I don't grok it.

Screen Shot 2020-12-21 at 12.43.42 PM.png

  • Replies 4
  • Views 1k
  • Created
  • Last Reply
Posted

div#page-section-5f822b217761ab2128ed6af3 p { margin-top: 2px; margin-bottom: 2px; }

this worked for me but try changing the div# to your page and see if that helps. I know how annoying this might be. I am finding so many issues with this 7.1

Posted

I contacted the customer support and they said it appears to be an issue with 7.1 and now are in the process of bumping it up the chain of command. 

Thanks for the css solution though!
-

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.