Image Block Poster - Move Text

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!

The password that you shared is not working. Were you able to solve the problem?

9 minutes ago, Wolfsilon said:

The password that you shared is not working. Were you able to solve the problem?

Try HELPPLEASE123. So I figured out how to move the text to the left, the main issue is that now it bleeds over the image in mobile format.

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.

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.

@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?

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?

On 12/14/2021 at 5:50 AM, tuanphan said:

HelpPlease123!

The password incorrect. Can you check it?

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

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