Z-index rendering bug in Chrome 19?

Question

I have a dropdown menu on a site that was displaying correctly in all browsers including Chrome up until recently. Now in Chrome 19 it is rendered behind another element even though they both have positioning and the menu has the higher z-index.

See image of top right corner:

And here is the site: http://www.mediaplanet.com/international/

Is this a rendering bug or is something wrong with my code?

Answer 1

In your style.css stylesheet, set a z-index of 9999 to #header .row and that should do it.

Currently it is:

#header .row {
  position: relative;
  overflow: visible;
}

It works for me in Chrome 19 if you change it to:

#header .row {
  position: relative;
  overflow: visible;
  z-index: 99999;
}

That should do the trick! :)