Hello! I have used “Text with image”-sections on my website and I’m happy with the layout on the desktop version. But in the mobile version the text appears over the image and I would like for it to appear underneath it. Can someone give me advice on how to display the text underneath the image instead of on top of it in the mobile version?
URL: https://ournewroutine.com/pages/our-story
Thanks in advance!
@Kajsa add this css to the very end of theme.css and check, if any issue you can email me I will check it
@media screen and (max-width: 640px){
.FeatureText--imageLeft {flex-direction: column;}
#shopify-section-page-our-story-text-with-image-2 .FeatureText{display: flex;
flex-direction: column-reverse;}
}
I appreciate you taking the time to look at my problem! Will I have to add this for every section I wish to have the same appearance or is there a way to write the same code that applies to all of these sections (Text with image)?
Thank you!
section ids are different and hence we need different settings, I think
used sections are different too , means one is text with image and other is
different
I went on and added the code to the theme.css, and the changes applied sucessfully to every section except two of them. Can you please tell me what code I can add to use the same appearance on these sections? 
The second Text On Image-section here: https://ournewroutine.com/pages/silk-benefits
And the second Text On Image-section here: https://ournewroutine.com/pages/silk-care
Thank you!
@Kajsa - all code need to be added is page specific and hence not feasible to apply on many pages , for 2 given pages, add this
@media screen and (max-width: 640px){
#shopify-section-page-benefits-text-with-image-2 .FeatureText{display: flex;
flex-direction: column-reverse;}
#shopify-section-page-care-text-with-image-2 .FeatureText{display: flex;
flex-direction: column-reverse;}
}
Thank you, I figured it out and it all works successfully now! I appreciate you taking the time to explain!
@Kajsa - welcome