How can I arrange images and text side by side on a mobile homepage?

Store Design
1

There is a section on my shopify homepage that is “image with text” - on a desktop the image is on the left and text is on the left, but on mobile, both are stacked (image is at the top and text is on the bottom). is there a way to make it look the same on mobile (ie the image and text are side by side)??

My theme is debut

Thanks!

2

Hello @FS1949 ,

It’s the GemPages Support Team and we are glad to assist you today!

Could you please share your store URL ( with the password if your store password is enabled ) then I can see and suggest something for you?

Best regards,
GemPages Support Team

3

Website is: www.thefuzzysprout.com

4

@FS1949

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > theme.scss and paste this at the bottom of the file:
@media (max-width: 749px){
    .feature-row__item {
        width: 50%;
    }

    .feature-row {
        flex-direction: row !important;
    }

    .feature-row__item.feature-row__text.feature-row__text--left {
        padding-top: 0;
        padding-left: 20px;
    }
}
1 Like
5

This worked! Is there anyway to make the image bigger/longer so it is the same size as the text? or to make the text size smaller?

6

Hi tried, but not working in my case.

Couldn’t find theme.scss tried to add in theme.js**, but not working**

please advise

7

I added it to asset but it didnt work. I dont have theme.scss.