[Resolved] z-index not working

Home Forums Support [Resolved] z-index not working

Home Forums Support z-index not working

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
  • #2228825

    Hi there,

    I’m trying to implement a button on my site that has a “shadow” underneath it – it’s not actually a shadow, it’s making use of the :after pseudo element to add a coloured block underneath. Here’s my CSS:

    .reply-button {
      background-color: var(--bg);
      border: 2px solid var(--text);
      text-decoration: none;
      padding: 10px 30px;
      font-weight: bold;
      font-size: 30px;
      position: relative;
      color: var(--text);
      content: '';
      position: absolute;
      background-color: var(--text);
      z-index: -1;

    Problem is, when I set the z-index to -1 the backgound goes behind the body, so it’s not visible. I’ve tried setting .reply-button to 2 and the :after to 1, but this just ends with the background being on top. What am I doing wrong here? This css worked fine with another theme.



    Customer Support

    Hi Kev,

    To have a better understanding of the issue, may you kindly provide the link to the site in question?

    You may use the private information field for this: https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

    Hope to hear from you soon. 🙂


    Sure, private info attached.

    Customer Support

    Thank you for adding the link to your site!

    You’ll need to add a relative positioning and a z-index of 1 to the parent element to make it appear.

    You may try adding this CSS for instance in Appearance > Customize > Additional CSS:

    .gb-button-wrapper.gb-button-wrapper-913e6f26 {
        z-index: 1;

    Hope this clarifies. 🙂


    Doh! Make the z-index of the button wrapper one higher…fresh pair of eyes and all that. Thanks Fernando, that worked perfectly.

    Customer Support

    You’re welcome Kev! Glad that worked! 🙂

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.