The letters of the words in some headings are divided into several lines

Hi there,

the default layout won't break words into several pieces.
I there a specific heading i should be checking as i could not see the issue?

Hi,

The H1 header of the front page. In the customizer display modes it looks good, but I have tested on two different inch smartphones and it does not display correctly (Xiaomi Redmi 9 and Xiaomi Redmi 6A). I have also tried the Chrome inspector and it displays badly in the following resolutions: 360x640 (Galaxy S5, Moto G4) and 320x568 (iPhone 5 / SE).

The template I'm using is one of the ones that come in the official GeneratePress library (https://generatepress.com/site-library/); it's called Access.

Thanks.

Hi Miguel,

Access is using Headline block from Generateblocks for the H1, while your site is using Heading block of WordPress.

If you want to control the font/letter space on mobile, I'll recommend using Headline block from GB.

I checked your site, I don't know your language, can you tell me which word breaks into different lines:
https://www.screencast.com/t/IoBnN3Hly

Can you tell me what exactly you want it to look like on mobile?

Let me know.

Hello,

I have changed the header block to Generateblocks and it still looks the same.

The language of the website is Spanish. The word in question being divided is "focused."

The logical thing is that if the screen is too small for the sequence "Focused Webs" the division between lines is the following: "Webs" (line 1) and "focused" (line 2), alone or accompanied by the following word (" in").

Thanks.

Can you provide a screenshot of the problem you see on the Phone ?

Hi,

I am attaching a screenshot: https://www.screencast.com/t/vREM4FSz9uZ. Anyway, as I told you, in the Chrome inspector I also get this way in the preview of some smartphones.

Thanks.

Aah ok.
The problem i see is you have a non breaking space between these two words:

Webs enfocadas

ie.

Webs enfocadas

if you remove it then the words will reflow to a new line wihtout breaking the word, unless the word is really long and overflows the container.

If you want to keep those two words on the same line then you would to give them some more space by either:

1. Reducing the mobile font size for that Headline Block.
2. Reduce the padding on the Container Block.

LOL

My God, I have no idea how I got that into the code… I was freaking out. Sure, since I was using the visual editor the unbreakable space was not visible. I have put the code editor and there it was ... Issue solved.

Thanks a lot. You are the best. :-)

Glad to be of help!