Home/ Questions/Q 9251143
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-18T10:37:23+00:00

I am facing a strange problem where the a navbar I have created is

  • 0

I am facing a strange problem where the a navbar I have created is displaying differently in Chrome than Firefox. Here is a screenshot of each. Firefox is displaying it correctly:

Firefox Navbar

While the background colors are getting lost in Chrome:

Chrome Navbar

I have created a fiddle here, but the problem is not apparent when viewed on the jsfiddle site using Chrome. In the live Chrome browser, the body declaration over-rides the definition for the navbar, even though z-index is used.. Any ideas on how to solve this strange issue? Im using an old version of Chrome right now (21.0.1180.90), trying to insure backwards compatibility. Thanks for your ideas!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Your code works fine tested in “live Chrome browser” 21.0.1180.89 (couldn’t find the 21.0.1180.90) on OS X 10.8.2.

    And I think you are missing the point of z-index:

    For a positioned box, the ‘z-index’ property specifies:

    • The stack level of the box in the current stacking context.
    • Whether the box establishes a stacking context.

    http://www.w3.org/TR/CSS2/visuren.html#z-index

    z-index is not used to override any other css declaration.

    • 0