Image in front of another image

Hello,
could you please help me with this issue?
here’s an image of how things are right now:

i would like the yellow balloon to be on top of both the other images, so both the left and the right sides will be like that.

i tried a few things among which the most obvious one (changing the z-index) but that didn’t help, unfortunately. could you help me out?

Hi There,

It works fine with adjusting the margin and width of the image no need to ad any z-index.

Please have a look.

Thanks

It doesn’t. you see in the left side of the yellow balloon, the image is in front of the starter ballon (purple one), but on the right side, it’s behind the pro balloon (blue one), i want the yellow one 100% in front of the pro balloon.

Just to make sure, i don’ want all of them to look aligned, i want the yellow one to stand out a bit by bringing it in front of the other balloons, the ones on its side will be behind (and the edges will be overlapped by the yellow balloon). don’t worry about margins and stuff because the only thing i’m missing here is the yellow balloon being in front of its side’s

Hi There,

Try adding z-index:10; to the column’s inline CSS.

You can go there by clicking on the column with the yellow balloon and then click customize.

Hope it helps.

nope, that z-index was added by me, unfortunately that didn’t work at all.

Hi again,

To fix the issue, please add the following CSS code in the Theme Options > Global CSS or in the Customizer via Appearance > Customize > Custom > Edit GLOBAL CSS

.page-id-32 .e32-20.x-column.x-sm.x-1-5 {
    position: relative;
    z-index: 9;
}

Cheers!

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