Z-index of bottom separator

Hey Pro People.

I’m having problem trying to get the z-index of my bottom separator to sit below the background image of the section.

I want the tomato which is cut off to scroll down to the angle of the next section.

I don’t want to use a top separator on the next section because as you can see it’s a textured image background. I also have floating elements (eggplant/aubergine/:eggplant: ) on the page which are detrimental to the current z-index set up which you’ll see when you visit and scroll.

I tried using an inbetween z-index using CSS but it doesn’t work.

.x-separator-bottom-angle-in {
z-index: 9993 !important;
}

(the section it’s attached to’s z-index is 9994)

But no luck. I’ve left the sites staging area in the secure notes - figure you won’t need a login to tell me whether I can change the z-index of a separator or not :slight_smile:

Interested to hear your advise on how i get the red tomato over the separator :slight_smile:

Thanks in advance

Hi J,

Thanks for reaching out.

Unfortunately, it’s not gonna work since it’s a background. And the background is limited to its container’s size, hence, it’s gonna clipped.

It will only work if the separator is part of the content where the background is. But by doing so, it will break the layout and the constraining margin and padding will greatly affect it. It will then kill the purpose of separation between sections.

I guess you should do that as a floating image instead of the background, just like what you did on the eggplant image. Plus, the separator clips the section below it, and not above it.

Thanks!

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