HalfShadow and z-index

Hi @Marten

I have a quick question about HalfShadow. I really like the effect you offer with this stack and try to use it often. I am back to my web site (Elixir’s Lunar theme, https://cognitiveconstruction.com) after a long absence, and noticed a puzzling behavior. The Lunar theme has a sticky nav bar that pins to the top when scrolling down the page. I have some content in HalfShadow stacks, and noted that the images in the stacks properly slides behind the nav bar, but the card content slides over the nav bar. I assume this is a z-index issue, but have no idea on how to adjust that via HalfShadow. Am I on the right track here, and if so … any thoughts on how to adjust HalfShadow’s performance?

Thanks very much for any help you might offer, and thanks for a great stack.

You’re probably better off increasing the z-index of the banner. Try this CSS code (add it to Settings --> Code – CSS):

.banner-overlay {
    z-index: 3;
}

If that doesn’t work, then you may need to add " !important" after the “3”.

1 Like

Hi @Tom

@DLH is absolutely right.

If it doesn’t work first time, you’ll probably need to do a full republish.

Marten

@DLH and @Marten:

Worked like a charm, DLH. Many thanks you you and Marten for your prompt and really helpful suggestion.

Hoping you both have a great weekend,

Tom

1 Like