Jump to content

Change letter spacing in carousel item description

Go to solution Solved by tuanphan,

Recommended Posts

Site URL: https://hexaflexagon-mayflower-a6wt.squarespace.com/meet-our-team

Hi, is there any way to change the letter spacing in the item description within a carousel? Although the font size is correct, the spacing between letters looks much smaller/narrower than everywhere else on the site.

Please see the attached image illustrating the problem. The red box shows the letter spacing in a carousel item description — you can see it has much tighter spacing between the letters. The green box shows the letter spacing everywhere else on the site. I would like to make the spacing shown in the red box match the rest of the site.

I've tried adjusting this through the carousel editor, and with custom CSS, but have not yet found a solution.

Thanks so much for your help! I would be so grateful to solve this.

Squarespace Carousel Font Spacing Problems.png

Link to comment
  • Solution

Add to Design > Custom CSS

.user-items-list-carousel__slideshow-holder p {
    letter-spacing: 5px;
}

 

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
On 8/20/2022 at 9:48 PM, tuanphan said:

Add to Design > Custom CSS

.user-items-list-carousel__slideshow-holder p {
    letter-spacing: 5px;
}

 

Thank you @tuanphan. I was able to reference your css code to adjust the kerning problems for the simple list on my site as well. Your help is much appreciated!! 😀

 

For anyone having the same issue but is using a simple list rather than a carousel, this is what I used (you can change the numerical letter spacing value per your need:

.user-items-list-simple p {
    letter-spacing: 1.5px;
}

Link to comment
On 8/20/2022 at 6:48 PM, tuanphan said:

Add to Design > Custom CSS

.user-items-list-carousel__slideshow-holder p {
    letter-spacing: 5px;
}

 

OP here. Thank you! I adjusted the value and was able to successfully make the letter spacing in the carousel match the rest of the text on the site.

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.