Minimum and maximum value of z-index?

Sachin Gaur picture Sachin Gaur · Jan 29, 2009 · Viewed 381.8k times · Source

I have a div in my HTML page. I am showing this div based on some condition, but the div is displaying behind the HTML element where I pointed the mouse cursor.

I have tried all values for z-index from 0 - 999999. Can anyone tell me why this is happening?

Is there any minimum or maximum value of Z-INDEX property of CSS?

I am showing and hiding the div with .divClass onclick via the <asp:hyperlink> using jQuery.

Answer

Tamas Czinege picture Tamas Czinege · Jan 29, 2009

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

'z-index'

Value: auto | <integer> | inherit

http://www.w3.org/TR/CSS21/syndata.html#numbers

Some value types may have integer values (denoted by <integer>) or real number values (denoted by <number>). Real numbers and integers are specified in decimal notation only. An <integer> consists of one or more digits "0" to "9". A <number> can either be an <integer>, or it can be zero or more digits followed by a dot (.) followed by one or more digits. Both integers and real numbers may be preceded by a "-" or "+" to indicate the sign. -0 is equivalent to 0 and is not a negative number.

Note that many properties that allow an integer or real number as a value actually restrict the value to some range, often to a non-negative value.

So basically there are no limitations for z-index value in the CSS standard, but I guess most browsers limit it to signed 32-bit values (−2147483648 to +2147483647) in practice (64 would be a little off the top, and it doesn't make sense to use anything less than 32 bits these days)