Minimum and maximum value of z-index?

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?

.divClass {
     position: absolute; 
     left: 25px; 
     top: 25px; 
     width: 320px;
     height: 300px; 
     z-index: 1000; 
}
<table cellspacing="0" cellpadding="0" width="100%">
  <tr>
    <td>
      <asp:HyperLink ID="lnkProgram" runat="server"></asp:HyperLink>
    </td>
  </tr>
  <tr>
     <td>
         <div class="divClass">
           Some Data
         </div>
     </td>
  </tr> 
</table>

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

10 s
10

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)

Leave a Comment