Problem with z-index

I'm trying to use z-index to layer a button and a div. The button appears behind the div, while according to z-index it should be in front of it. Here is the style elements associated with the button & div as captured 开发者_如何学Goby Firebug:

Note that the button has a z-index of 2, the div has a z-index of 1, and both are position:relative.

Full HTML is in this pastebin.

z-index is a relative, not an absolute value.

An object with z-index 10 billion will not appear on top of all elements on the page, only on top of other elements in the same stacking context

http://css-discuss.incutio.com/wiki/Overlapping_And_ZIndex

http://tjkdesign.com/articles/z-index/teach_yourself_how_elements_stack.asp

In the CSS hierarchy you posted, it looks like the button and div are contained in different elements (#note18 and #note19), so you'll have to make sure that those elements aren't creating different stacking contexts which will make any z-indexes for elements inside them irrelevant to each other.