Moving header on image with text on mobile

[Eman_Akb]

on mobile, I want the header to be on top of the image in my "image with text" section. how do I do so?

[Dan-From-Ryviu]

Hi @Eman_Akb 

Could you share the link to your store and explain more about your request? 

[Eman_Akb]

https://filtrina.com/

The text goes on over the image just fine on desktop as as shown in BSSCommers reply to my post.

but the text goes under the image on mobile which is what I'm trying to fix

[BSSCommerce-B2B]

@Eman_Akb ,

1. Using the Shopify Admin (Easiest Method)

• Go to Shopify Admin > Themes > Customize.
• Navigate to the page that contains the "header" section and  "image with text" section
• Drag and drop the sections to change their order as desired.

2. Using javascript

Step 1. Go to Admin -> Online store -> Theme > Edit code

Step 2. Find the file theme.liquid

<script>
document.addEventListener("DOMContentLoaded", function() {
  var section1 = document.getElementById("shopify-section-sections--16262079283335__2c2ec774-3430-481f-b927-e9c035b9d24e");
var section2 = document.getElementById("shopify-section-sections--16262079283335__header");
  var parent = section1.parentNode;
  parent.insertBefore(section2, section1);
});
</script>

Result

[Eman_Akb]

It did not work. The text goes on top io the image just fine on desktop as your showed in your result picture.

but the text goes under the image on mobile.