Trying to change order of image with text on mobile

Store Design
1

I am trying to adjust the order for which an image with text section appears on mobile. I have tried editing the css but am not having any luck.

It currently shows:

Heading

Subheading

Image

and I would like to change the order for this area to

Image

Heading

Subheading.

Please help if possible. I added the following code in the theme.css file at the end of the image with text section but am still having issues.

image.png
image.png999×136 74.8 KB

Thank you.

1 Like
2

Hi,

A very good question, please share your store URL so I can answer according to your theme

3

@KGBeastXxX

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

4

Hello,

Below is the site url, thank you!

https://waxonewax.com/

Thank you,

1 Like
5

You can add this

.feature-row–no-overlapping .homepage-featured-content-wrapper {
flex-direction: row-reverse;

}

6

@KGBeastXxX

great thanks for details please add this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme-index.min.css ->paste below code at the bottom of the file.
    this code apply for after 5 - 6 second
@media only screen and (max-width: 767px) {
.homepage-featured-content-wrapper, .homepage-map-wrapper {display: flex;flex-wrap: wrap;}
.feature-row--no-overlapping .feature_row__image_wrapper {order: 2;}
}
1 Like
7

Thank you very much Ketan, it works great!

1 Like
8

@KGBeastXxX

it’s my pleasure to help us