How can I adjust the left padding on an image with text in Dawn theme?

Technical Q&A
,
1

Hi,

I am using the Dawn theme, and using the “Image with Text” Block, I would like to have my left image like this:

1-what-I-need.png
1-what-I-need.png1205×470 189 KB

But it keeps showing up like this (cutting off the picture):

1-existing.png
1-existing.png1012×561 169 KB

It doesn’t let me adjust the vertical padding of the image with text… anybody have a clue on how I can fix this?

Please & thank you

2

Hello @Snugglevest

I would like to give you a recommendation to support you.

I see your image is cutting off when the text is getting longer.

So that the image is not cut off, you can try adding code by following below:

  1. Go to Online Store → Theme → Customize https://prnt.sc/TttHuulWLqhk

  2. Add a Custom liquid section on page https://prnt.sc/kaDXz8HTUl7m

  3. Paste the below code into custom liquid.

GemPages_0-1670146019190.png
GemPages_0-1670146019190.png1906×927 249 KB

Note: when using the above code, some section settings will no longer work.

Hope my recommendation can works and support for you!

Kind & Best regards!
GemPages Support Team

3

Hi GemPages,

It kind of works, but unfortunately that makes it have way too much space in mobile:

mobile.png
mobile.png391×711 86.4 KB

4

Hi @Snugglevest

Can you give me your page link so I can check it for you?

Best regards,
GemPages Support Team

5

www.snugglevest.com or snugglevest-4099.myshopify

6

Hi @Snugglevest

I have checked. The image has a padding-bottom https://prnt.sc/mwaUwni6Vl5C

You can remove the spacing in 2 ways:

  1. You can choose Small on the Image height option.

GemPages_0-1670207098394.png
GemPages_0-1670207098394.png1897×912 215 KB

On desktop, the image also will center vertically https://prnt.sc/FwjxFNi5AQah

  1. Or you can remove the spacing only on mobile by updating the code in the Custom liquid section.

Best regards,
GemPages Support Team