How can I make an image appear on top in an 'image with text' section?

Store Design
, ,
1

Hello!
I’m using the Origin theme and I added an “image with text” section. The image theme layout is set to overlap, but when the text is longer than a few lines, the image gets hidden under the segment with text. Is it possible to switch it, so that the image appears on top?

Screenshot below:
https://drive.google.com/file/d/1iPpeK7RzlV8iQM1O1JPgQIvidWnSGU2k/view?usp=sharing

2

Hi @thunderroar

Can you kindly share your store link (with the password, if any) with us? We will check it and suggest you a solution if possible.

3

Hi @thunderroar

  • When you adjust the Content layout to Overlay in the Image and Context section, the text will have a higher stacking order than the image.

  • To adjust the opposite, go to Themes → Edit code

![view (25).png|1856x986](upload://u7qY1dEPbbvpaTjJpacKqxcDzpK.png)

Next, go to the Assets folder → select the component-image-with-text.css file. Then, add this code at the end of the file and click Save:

.image-with-text__media {
  z-index: 5;
}

If you need further help, feel free to let us know. We hope that it will work for you.

1 Like
4

It works perfectly! Thank you!

1 Like