[Resolved] Mobile: Page Hero Font doesn’t fit

[Janet Davis]

Hello,
On the desktop and tablet the home page hero font looks great.
On the phone the font goes into the image.
The Page hero is one image, not a background and an image added within the page hero.

I’ve played with different css from the forum and deleted them for they didn’t work.
I want to keep the integrity of the. lettering and have it go smaller as a unit. Not make it all one size smaller.

Is there a way to do this either with css or floating an image to the right and lettering to the left? Or?

Thank you.
Janet

[Leo]

Hi there,

I don’t really see a good way to keep that layout on both desktop and mobile unfortunately.

What if you use the grid blocks from GenerateBlocks to create that layout on desktop?

Then they would be stacked on mobile.

[Janet Davis]

If I use the grid blocks instead of the page hero would I lose the ability to have the header combined with the area?

[Leo]

Nope – you can still use a header element to merge:
https://docs.generatepress.com/article/transparent-header-and-navigation/

Not sure why you would need to though. Your current layout doesn’t really need a merge from what I can see.

[Janet Davis]

Currently, the look I have on the site is from clicking the merge header in elements.
I will play with it.
Thank you
Janet

[Leo]

No problem 🙂

[Author]

Posts