Text elements z index

Hi. I have 3 separate text elements in the same column on a website I’m redesigning.

I want the word at the top to be behind the word in orange. I’ve tried adding css to each piece of text and then making the z index for the top word higher but it’s not working.

Can you advise?

Hey @Lorenmn,

Thanks for writing in! Please provide the URL of the page where we can find the one on your screenshot so we can double-check your Text element settings.

Best Regards.

I’ve added a secure note to this reply as the site is currently in dev.

Once in, it’ the homepage.

Hi @Lorenmn,

The text through interactions with horses is above the orange text, so you need to set the z-index value to that text element. But as the position is set to static, you have to set position to relative to z-index work. The custom CSS code will look like the following, and you need to add this to the Element CSS of the text element.

$el.x-text
{
    z-index:-1 !important;
    position: relative !important;
}

Please remember that the above code will work if copied as it is and doesn’t conflict with any existing style.
Please note that the code provided serves only as a guide to help you get started custom-coding on your own if there’s no option offered in our theme or the products we bundle.
We really do not provide support for custom codes, which means we can’t fix them in case they conflict with something on your site, nor will we enhance them. Further customization should be directed to a third-party developer or you can avail of One, where we answer the questions beyond normal theme support.

Thanks

Hi, sorry I think I typed it wrongly. I want the orange word to be behind the others. I’m happy with where the ‘through interactions with horses’ is.

I used the code you provided on the orange word and it works! Thank you!

Hi @Lorenmn,

Glad that we are able to help you.

Thanks

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.