Jump to content

Custom font creating horizontal bottom scroll bar? Please help 🙏🏻

Recommended Posts

Hi guys,

I'm struggling with my custom css as I wanted to use a custom font for the H1 tag which I have uploaded the font and used the following code to apply it to the website:

@font-face {  
font-family: 'enigma';  
src: url(https://static1.squarespace.com/static/62f5fc15d202395293de4f98/t/63105619a32f67427b02f9ee/1662015001793/TAN+-+ENIGMA.otf);


h1 {
  font-family: enigma !important;

The problem is that using this font is creating a horizontal scrollbar on the bottom of the website. As soon as I remove this line of code:

h1 {
  font-family: enigma !important;

The bottom horizontal scrollbar disappears.... any ideas? I don't want the scrollbar but I do want the font haha! How do I make this work?

I have tried removing all other pieces of css but the bottom scrollbar remains unless I specifically remove the H1 styling 🤪

Site password is admin


Edited by Desnoir
Link to comment

It looks like the custom font is working fine, and I don't see a horizontal scroll bar.

It may be just that with the scaling text when you change the font it temporarily changes the size and the scroll bar appears until you reload the page.

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
Hire me on Upwork!

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
 🔲 SQSP Themes (Referral link) 
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

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.