How to remove automatic hyphens on Squarespace mobile

CUSTOM CSSVERSION 7VERSION 7.1
Written By insidethesquare

This tutorial is for both versions of Squarespace, 7.1 and older versions built with 7. For more information, visit https://insidethesquare.co/themes

Most Squarespace templates automatically add hyphens to header text on mobile devices.

If you aren't a fan of that display style, this snippet of code will stop that from happening!

Paste the code below into the custom CSS of your Squarespace site to disable that functionality.

If you just want this to happen for heading text, Squarespace 7.1 sites have one more variation than Squarespace 7, so be sure you copy the right code below.

 

ALL TEXT

body {-webkit-hyphens: manual !important; -moz-hyphens: manual !important; -ms-hyphens: manual !important; hyphens: manual !important; }

HEADING TEXT ONLY - SQUARESPACE 7.0 SITES

h1, h2, h3 {-webkit-hyphens: manual !important; -moz-hyphens: manual !important; -ms-hyphens: manual !important; hyphens: manual !important; }

HEADING TEXT ONLY - SQUARESPACE 7.1 SITES

h1, h2, h3, h4 {-webkit-hyphens: manual !important; -moz-hyphens: manual !important; -ms-hyphens: manual !important; hyphens: manual !important; }

insidethesquare

Squarespace Circle Leader & Creator of InsideTheSquare.co

https://insidethesquare.co
Previous

How to customize the search bar in Squarespace
Next

How to center your mobile menu (Bedford & Brine)