Jump to content

Mobile view is cutting into my sentences/words and putting it down to the next line, any code to stop this?

Recommended Posts

The overflow-wrap property for your site is set to break-word. this means that if a long word is encountered that is wider than the container its in, then browsers are allowed to break that word at arbitrary points and move it on to the next line. This is actually the default for Squarespace, so you could override that in CSS. To be honest, this is probably the best setting though...

Before we override then, we have to wonder why it wouldn't break at the existing spaces for example around DWP? Well, it seems that there are non-breaking spaces around those which have been put in. These tell browsers not to break there, so it looks at "begins, DWP Restart" all as one word. if you look at the HTML for this it looks like this. "begins, DWP Restart".

So really what you need to do here is remove those non-breaking spaces. I don't know if you put them in yourself and if so why? but if you remove them it will be fine. It looks like there's loads of these non-breaking spaces in your article, so I'm wondering if you've copied them in from another system maybe.

What you probably need to do is copy the text of your articles again, and when you go to insert it into your blog post, use the clipboard icon on the tool bar (or press Ctrl+Shift+V) to make sure that you copy it in as plain text and not with the existing formatting which seems to have these non-breaking spaces embedded in them.

That should solve your problem. Without fixing that, any CSS override/implementation will likely make things worse not better.


EDIT: Just thought I'd add the screenshot of your source. Here's the code of your site and you can see all the non-breaking spaces in there. you can't see them in your site though (they're spaces!)


Edited by iamdavehart
added screen shot to show  

Dave Hart. Software/Technology Consultant living in London. buymeacoffee 

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.