How to adjust a specific "Image with Text" section on MOBILE

Store Design
, , , , , , , , , ,
1

Hi, I need help adjusting the “Image with Text” section on mobile:

Snímek obrazovky 2025-01-13 215616.png
Snímek obrazovky 2025-01-13 215616.png365×845 52.1 KB

  • I want to set the image to 307x307px.
  • I want the text size to be 33px.

Here’s my store: https://1049xn-ya.myshopify.com/

I ONLY WANT THIS CHANGE FOR MOBILE; ON DESKTOP, I WANT IT TO STAY AS IT IS.

Thanks a lot,
Tim

2

Hi @CreatorTim

I hope you are well. You can follow our instructions below:

1/ Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
2/ From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/iDxwa8zBQ4Z-
3/ Copy the code below and paste it there

Here is the code for Step 3:

@media screen and (max-width: 768px){
div#shopify-section-template--22711083729161__image_with_text_ejW6Nw .image-with-text__media img, div#shopify-section-template--22711083729161__image_with_text_ejW6Nw .image-with-text__media {
    width: 307px !important;
    height: 307px !important;
    margin-inline: auto !important;
}
div#shopify-section-template--22711083729161__image_with_text_ejW6Nw .image-with-text__text-item.grid__item h2.image-with-text__heading.inline-richtext.h1 {
    font-size: 33px !important;
}
}

image (2).png
image (2).png351×755 37 KB

Please let me know if it works. Thank you!

Best,
Daisy - Avada Support Team.

3

WORKS! Thank you so much brother!