How do I move the text above the image in mobile view only?

[cedelgado]

I would like the text above this image. Thank u in advance. Site is marinprestige.com. I am using the debutfify theme.

[LuffyOnePiece]

Hi @cedelgado ,

Add below css to the theme.css file

@media (max-width: 767px) {
  div#shopify-section-template--22714835042577__image_with_text_GngrPg .row.gx-0.gy-3.gy-md-0.flex-row-reverse {
    flex-direction: column !important;
  }
}

Please don't hesitate to reach out if you need further help optimizing or customizing your store. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
LuffyOnePiece

[Huptech-Web · Accepted solution]

Hello! @cedelgado Please follow these steps to add this CSS code:

1. Go to your Online Store
2. Click on "Themes"
3. Select "Edit code"
4. Open your CSS file. If you have a custom CSS file, open that instead.
5. If you can't find your custom CSS file, open "base.css"
6. Add the following code at the end of the file.

@media only screen and (max-width: 750px) { 
  body .flex-row-reverse {
    flex-direction: column-reverse !important;
  }
}

 If you need further assistance, please let me know. If you found my help useful, consider liking this message and marking it as the solution.

[cedelgado]

This one worked. Thank you!

[Huptech-Web]

Most Wellcome! @cedelgado If the solution presented meets your needs and addresses your query effectively, I encourage you to accept it as the chosen answer. This will acknowledge the support you received and aid fellow community members in identifying reliable and effective solutions for their similar concerns.
Thank you.