Jump to content

Image Block Poster - Move Text

Recommended Posts

Site URL: https://www.thrivelymentalhealth.com/home

Hello, 

I am using an image blog poster and would like to move the text further left.  I have searched the forum and found some code but can not get the Header, subtext, and button to move left, only up down and right.  Does anyone have the code to do this?

I have also realized that the text stretches over the image on mobile, how can I make it "downsize" to stay on the image?

Also, if someone has a tool to identify block ids that would be great.

 

Password: HelpPlease123!

Edited by Thrively
Link to comment
  • Replies 8
  • Views 509
  • Created
  • Last Reply

Top Posters In This Topic

1 hour ago, Wolfsilon said:

Before doing anything else to the CSS, trying navigating to: Home -> Site Styles -> Image Block -> "Image Block Poster."

From there make sure that your content width setting is 90, or above. If that doesn't solve the problem. Let me know.

So all that does is extend my text of the main part of the picture which includes the business owner.  It obstructs her face and makes the text hard to read in spots.  I want to concentrate it over to the left in the "open" part of the image.  I have the code that does this but now it looks terrible on mobile.

Link to comment
On 12/13/2021 at 12:39 PM, Thrively said:

@tuanphan I have seen you solve this before but I can not get it to work with the code you have provided in the past.  I am able to move the text to where I want but then when I look at the mobile version the text expands beyond the image.  Any ideas?

HelpPlease123!

The password incorrect. Can you check it?

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
On 12/15/2021 at 12:34 PM, Thrively said:

It is HELPPLEASE123. @tuanphan did that password work for you?

#1. It looks like you fixed?

#2. I have also realized that the text stretches over the image on mobile, how can I make it "downsize" to stay on the image?

Add this to Design > Custom CSS

/* Poster on mobile */
@media screen and (max-width:767px) {
div#block-37eb36512dc6ef891053 .content-fill {
    padding-bottom: 100% !important;
}
}

Then save & reload the site

#3. To find block id, use this free tool. https://chrome.google.com/webstore/detail/squarespace-id-finder/igjamfnifnkmecjidfbdipieoaeghcff?hl=en

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.