Jump to content

Text poster overflowing on mobile and tablet mode

Recommended Posts

Site URL: https://www.geraldinejosephine.com/travailler-avec-moi

Hello,

For my service page I am using two poster blocs next to each other with different backgrounds.
On comptuer view it's ok but when I am in tablet view or mobile view the text goes out of the background image and overflows.
I would like the text to be contained in the image background in all the modes. Is it possible? Can you help me with that please ?

apercu work with me.jpg

apercu work with me_mobile.jpg

Link to comment
  • Replies 3
  • Views 232
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

02 options to solve this

O1. You can add Text Blocks, then we can give code to add background color. This way, you won't have the same problem as above.

O2. Add this to Design > Custom CSS

/* Fix poster overflow */
@media screen and (max-width:1024px) {
div#page-section-62bb104ec6b62b463f5499f4 .content-fill {
    padding-bottom: 200% !important;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Thank you so much!
I tried the option 02 and it worked.

But I am curious would option one allow to have a better text alignement?
I don't have the same quantity of text on the two blocks and by default it's centered on the image, so for the moment on computer mode the paragraphs don't start on the same level.
And it's weird because on mobile mode its seems like the texte on blue background is centered but on beige background is aligned from the top.

Link to comment
11 hours ago, GeraldineJosephine said:

Thank you so much!
I tried the option 02 and it worked.

But I am curious would option one allow to have a better text alignement?
I don't have the same quantity of text on the two blocks and by default it's centered on the image, so for the moment on computer mode the paragraphs don't start on the same level.
And it's weird because on mobile mode its seems like the texte on blue background is centered but on beige background is aligned from the top.

You mean problem on mobile or desktop?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

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.