Archived topic
Mobile: Page Hero Font doesn't fit
5 replies · Started by Janet Davis on June 27, 2020
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
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.
If I use the grid blocks instead of the page hero would I lose the ability to have the header combined with the area?
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.
Currently, the look I have on the site is from clicking the merge header in elements.
I will play with it.
Thank you
Janet
No problem :)
