Jump to content

CSS to Customize Spacing of Item Title in Content Block

Recommended Posts

  • Replies 1
  • Views 199
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

This is a really annoying quirk but I came up with a SUPER convoluted way to solve this on a client site here: https://www.ashgrovecap.com/our-portfolio

First thing you want to do is put your title in the description of your list item and make it italic.

Then add this to your custom CSS:

// Headers in list section //

section[data-section-id="YOUR-ID-HERE"] {
  h2 {
    display: none;
  }
  em {
    font-size: 1.5rem;
    font-style: normal !important;
  }
  strong em {
    opacity: 0 !important
  }
}

So what this does is allows you to insert an 'invisible' word long enough into the title which gives us our space at the bottom.

In your case, it would be adding the word '1234' (or something similarly long) after '+', highlighting 'placeholder' and making it bold. This will hide it and make your title span two lines.

FYI, there may be an easier way to do it but at least this works!

Edited by bycrawford
Sam Crawford | by Crawford.
 
Multi-award-winning Squarespace expert
 
💸 How I make $500k/year designing Squarespace websites: Watch the video
📱 Hire me to build your Squarespace website: calendly.com/bycrawford/call
 
Did my comment help? To help others benefit, leave a like and mark my answer as 'best'. This lets users scroll straight to the solution they need.
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.