Jump to content

Turn off automatic hyphenation?

Recommended Posts

  • 3 months later...
  • Replies 19
  • Views 46.7k
  • Created
  • Last Reply

You would first need to specify the mobile screen size you are targeting, and the element such as body text, site title or whichever element it's occurring with. It might look something like this for iPad:

@media only screen and (max-width: 640px) {
 body {
   word-wrap: normal;
   -webkit-hyphens: none;
      -moz-hyphens: none;
           hyphens: none;

You would add this to the CSS Editor.

Link to comment
  • 3 months later...
  • 1 month later...
  • 5 weeks later...
  • 1 month later...
  • 3 months later...

Thanks! It took me a little searching to find this. I was searching word wrapping, word dashes, etc. This fixed my issues of my index text boxes being wrapped weirdly on an iPad 2 and in Firefox. I didn't have the same issue with Chrome, so weird.

Link to comment
  • 11 months later...
  • 1 month later...

It worked on Thorne. Thank you!Since the text I was wanting to apply the code to is formatted as Header 2 textI used it with h2 only p, h2 { -webkit-hyphens: manual !important; -moz-hyphens: manual !important; -ms-hyphens: manual !important; hyphens: manual !important; }

Link to comment
  • 3 months later...

Sorry to be slow (no coding experience whatsoever) but I am having this in Alex with the description on my banner image. I have tried to copy and paste this in the Advanced section in the banner but nothing happens. Any ideas?

Link to comment
  • 1 year later...


This topic is now archived and is closed to further replies.

This topic is now 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.