Support » Alpha/Beta/RC » New Admin Bar Web Developer Toolbar (Firefox)

  • Is there a way to get these to coexist in harmony?

    I typically use the:
    Information/Display Element Information
    feature of the Web Developer Toolbar.
    This will display a yellow information balloon in the top-left of the screen that describes in detail the CSS element that was clicked-on.

    Unfortunately, its z-order seems to be behind the admin bar, putting some of the most important information from this web developer toolbar in an impossible to view location.

    Has anybody else run into this?
    Anyone know of any workarounds?

Viewing 7 replies - 1 through 7 (of 7 total)
  • Moderator Dion Hulse


    Lead Developer

    I’d be reporting this to the Web Dev Toolbar authors, surely WordPress isn’t the only application/site which might have a upper toolbar with a z-index such as this.

    Pardon me for being blunt,
    but if we take that approachen, then I think we’d just be passing the buck.

    I’ve used the “Web Developer Toolbar” on countless websites, and never before encountered anything like this.

    We’re introducing a new toolbar into WordPress, and now is the time for us to be testing to make sure that it works with how we’re going to be using it on a daily basis.

    The fix that I’ve made is a very simple one that I’m hoping will be incorporated into the core.

    I changed line 92 of class-wp-admin-bar.php,
    <div id="wpadminbar">
    <div id="wpadminbar" style="z-index:1000;">

    It seems that the z-index value is somewhat arbitrary to getting these two toolbars to work in harmony… as I’ve tried values ranging from 0 to 1000, and they all worked.

    bluekachina – Out of curiosity, do you have the same problem on There’s a very similar admin bar used there.

    Thank you both Ipstenu and Dion for your replies.

    @ipstenu: I’m unsure as I don’t have any blogs hosted by

    @dion: My apologies for the blunt reply earlier.
    Your suggestion is probably the best route to take, and I ended up sending a message to the author of the Web Developer Toolbar.

    As it turns out, WordPress’ admin toolbar has a z-index of 99999.
    Remarkably high if you ask me. It appears as if there exists no upper-bound defined by the standards for CSS, meaning that it is entirely possible that some web developer somewhere out there might even have items on their website that would show up even in front of the admin toolbar.

    I think this remains a grey area that will need to be standardized in order to make applications like this compatible.

    Warm Regards to You Both

    You can just make an account and log in if you wanted. I was only wondering since you’d think it’d have come up before… It’s not needed at all.

    Sadly, it’s a chicken/egg issue. :/ There’s no right way, but I’d think if a dev toolbar is overriding how webpages render, that would be the place to start, too.

    No worries 🙂

    Moderator Dion Hulse


    Lead Developer


    As it turns out, WordPress’ admin toolbar has a z-index of 99999.
    Remarkably high if you ask me.

    I do agree, And I should’ve checked what it was before replying, Whilst it is high, it wouldn’t surprise me to find a theme using 20000 or something equally as crazy; so it isn’t as unreasonable as it could be in my mind.

    This has been brought up on Trac #16009 as well, there’s some discussion there, and is probably a better place for this discussion.

    Thanks Dion.

    @ipstenu: Yes, as it turns out… the same problem does exist also on

    Warm regards

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘New Admin Bar Web Developer Toolbar (Firefox)’ is closed to new replies.