• Resolved Anthyx

    (@anthyx)


    Hello and thank you for your very useful plugin.

    I have just recently found quite a big problem using it, hope you can help to solve it.

    The banner appears BEHIND the page header. It was not like this a few days ago, it started to be like this, as I said, just recently.

    Could you please help?

    Many thanks.

    A.

    https://wordpress.org/plugins/cookie-law-info/

Viewing 7 replies - 1 through 7 (of 7 total)
  • Thread Starter Anthyx

    (@anthyx)

    I have to add that it’s not just behind the header, there is also a certain distance betweeen the banner and the page top border.

    Thanks again.

    What’s your URL?

    This sounds like a z-index issue with your theme’s CSS file- did you update or change theme recently? This isn’t a plugin issue but is easy to fix by editing the CSS for your theme / child theme- try increasing the z-index value of the cookie bar.

    If you need any more help I’ll be happy to take a look but I’ll need your URL.

    Thread Starter Anthyx

    (@anthyx)

    Hi Richard, many thanks for your feedback.

    You’re most probably right, I recently set the z-index value to “auto” because the search box was conflicting with the last tab of the upper menu bar at lower resolutions (tablets).

    The URL is http://www.webfoodculture.com, below the actual style.css values:

    #branding .only-search #searchform {
    z-index: auto;
    top: -24px;
    right: 0px
    }

    I think it would be ideal to place your plugin popup on top of everything, but even if it works there is still the problem of the distance between the banner itself and the page top border.

    Any help is much appreciated, thanks!

    A.

    I have only had a chance to test it on iPhone but I can see the issue. A few things:

    – Your CSS selector is incorrect, if you’re targeting an ID you don’t need multiple selectors, just one

    – The z-index is the issue here- increase the cookie bar z-index until it is on top

    – Play with the margin of the other element until it’s right. I use Google Chrome Developer Tools for this so you can do it in realtime then copy the CSS as required.

    – This isn’t an issue with Cookie Law Info of course, like any theme you just need to adjust things to make it appear how you like 🙂

    That will do it.

    Try this:

    #cookie-law-info-bar {
    margin: -24px auto 0;
    z-index: 10000;
    }

    The “-24px” top margin is no coincidence (I’m referring to “top: -24px;” in your CSS above) – I guess you were playing around with your CSS and got to this figure for the header. I would have a rethink of the CSS for the header as you’re doing a lot of repositioning for the sake of it- there will be a simpler way 🙂

    Thread Starter Anthyx

    (@anthyx)

    Hi Richard,

    I’ve tried, it does not work. I have also tried to roll back all the changes I just recently made to the top part of the site but without success. So, since so much is going on in the header, I decided to switch the popup to the bottom side .. and it works perfectly!

    Many thanks for your help and again, thanks for your great plugin!

    Ciao

    A.

    Hi, I tested that CSS in Google Chrome and it definitely does work. Maybe you’re putting the CSS in the wrong place? Glad you got it working though! Cheers

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Banner appears behind the page header.’ is closed to new replies.