Why does my site break up words and paragraphs on blog pages?

[maternallyhappy]

Hi there,

Does anyone know why my site breaks up the words and paragraph on some blog pages and products as seen below. It is showing normally when I am writing the blog but doesn't like it when I publish it.

Webiste: www.maternallyhappy.com

Thanks heaps,

Caitlin

[tim]

It would be nice to see the actual article where you are having this problem.

Are you typing this in or copy/pasting?

Could be something like https://community.shopify.com/c/shopify-design/product-description-overflowing-to-the-right-side/m-p... and this "long word" can fit inside entry field in backend, but not when displayed on your site.

[maternallyhappy]

Hey Tim! Thanks for your response.

I've put the blog link below, it isn't published yet so not sure if you can see it with that link.

I generally copy and paste what I have written and then make edits

https://wb6z6ygdfw526rz0-28779282491.shopifypreview.com/blogs/the-pregnancy-library/articles?preview...

[tim · Accepted solution]

Yes, I can see the problem -- it's not the same as suggested above.

The theme includes a CSS rule the intended purpose of which I do not quite understand, but this rule is the reason for this behaviour.

It's easy to fix though.

Just add the following code to the "Custom CSS" section setting:

.prose span {
  display: initial;
}

You may consider adding it to the "Custom CSS" under Theme Settings, but it may affect other areas of the site -- needs further checking.

[maternallyhappy]

Thanks Tim, that was super helpful!!