Минимальное и максимальное значение z-index?

У меня есть div на моей странице HTML. Я показываю этот div в зависимости от некоторых условий, но div отображается за элементом HTML, на который я указал курсор мыши.

Я перепробовал все значения z-index от 0 до 999999. Может кто-нибудь сказать мне, почему это происходит?

Есть ли минимальное или максимальное значение свойства Z-INDEX 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>

Я показываю и скрываю div с .divClassпомощью onclick с <asp:hyperlink>помощью jQuery.

┌──────────────────────┬───────────────────┬──────────────────────────────────┐
│ Browser              │ Max z─index value │ When exceeded, value changes to: │
╞══════════════════════╪═══════════════════╪══════════════════════════════════╡
│ Firefox 0 - 2        │ 2147483647        │ element disappears               │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Firefox 3            │ 2147483647        │ 0                                │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Firefox 4+           │ 2147483647        │ 2147483647                       │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Safari 0 - 3         │ 16777271          │ 16777271                         │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Safari 4+            │ 2147483647        │ 2147483647                       │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Internet Explorer 6+ │ 2147483647        │ 2147483647                       │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Chrome 29+           │ 2147483647        │ 2147483647                       │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Opera 9+             │ 2147483647        │ 2147483647                       │
└──────────────────────┴───────────────────┴──────────────────────────────────┘

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

'Z-индекс'

Значение : авто | <целое число> | унаследуют

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

Некоторые типы значений могут иметь целочисленные значения (обозначаются <integer>) или значения действительных чисел (обозначаются <number>). Действительные числа и целые числа указаны только в десятичной записи. <Целое число> состоит из одной или нескольких цифр от «0» до «9». <Число> может быть либо <целое число>, либо это может быть ноль или более цифр, за которыми следует точка (.), За которой следует одна или несколько цифр. Как целым числам, так и действительным числам может предшествовать знак «-» или «+» для обозначения знака. -0 эквивалентно 0 и не является отрицательным числом.

Обратите внимание, что многие свойства, которые допускают целое или действительное число в качестве значения, фактически ограничивают значение некоторым диапазоном, часто неотрицательным значением.

Таким образом, в принципе нет никаких ограничений для значения z-index в стандарте CSS, но я предполагаю, что большинство браузеров на практике ограничивают его 32-битными значениями со знаком (от -2147483648 до +2147483647) (64 будет немного сверху, и это не имеет смысла использовать что-либо менее 32 бит в эти дни)

Мои тесты показывают, что z-index: 2147483647это максимальное значение, протестированное на FF 3.0.1 для OS X. Я обнаружил целочисленную ошибку переполнения: если вы набираете z-index: 2147483648(2147483647 + 1), элемент просто идет за всеми остальными элементами. По крайней мере, браузер не падает.

И урок, который нужно усвоить, заключается в том, что вам следует остерегаться вводить слишком большие значения для z-indexсвойства, потому что оно оборачивается вокруг.

Минимальное значение Z-индекса равно 0 ; максимальное значение зависит от типа браузера.

Это зависит от браузера (хотя максимальная версия всех браузеров должна составлять 2147483638), как и реакция браузера при превышении максимального значения.

http://www.puidokas.com/max-z-index/

Это максимальное значение 32-битного целого числа: 2147483647

Также см. Документы: https://www.w3.org/TR/CSS22/visuren.html#z-index (разрешены отрицательные числа)

Из опыта, я думаю, правильный максимум z-index- 2147483638.

Z-Index работает только для элементов, которые имеют position: relative;или position: absolute;применены к ним. Если это не проблема, нам нужно увидеть пример страницы, чтобы быть более полезным.

РЕДАКТИРОВАТЬ: Хороший доктор уже дал самое полное объяснение, но быстрая версия состоит в том, что минимум равен 0, потому что это не может быть отрицательное число, а максимум - ну, вам никогда не нужно будет превышать 10 для большинства проектов.

Я обнаружил, что часто, если z-index не работает, потому что у его родителя / братьев и сестер нет указанного z-index.

Так что если у вас есть:

<div id="1">
    <a id="2" style="z-index:2"></a>
    <div id="3" style="z-index:1"></div>
    <button id="4"></button>
</div>

элемент № 3 или даже № 4, возможно, оспаривают № 2 за пространство щелчка / наведения, хотя, если вы установите # 1 в z-index 0, братья и сестры, которые z-index поместили их в независимые стеки, теперь находятся в том же стеке. и будет z-индекс правильно.

Это полезное и довольно гуманизированное описание: http://foohack.com/2007/10/top-5-css-mistakes/  

Пользователь выше говорит: «Ну, вам никогда не нужно превышать 10 для большинства проектов».

В зависимости от вашего проекта вам могут понадобиться только z-индексы 0-1 или z-индексы 0-10000. Вам часто нужно играть в старших цифрах ... особенно если вы работаете со средствами просмотра лайтбоксов (9999 кажется стандартом, и если вы хотите увеличить их z-индекс, вам нужно его превысить!)

В то время INT_MAXкак, вероятно, самая безопасная ставка, WebKit, по-видимому, использует двойные для внутреннего использования и, следовательно, допускает очень большие числа (с определенной точностью). LLONG_MAXнапример, работает нормально (по крайней мере, в 64-битном Chromium и WebkitGTK), но будет округлено до 9223372036854776000.

(Хотя вы должны тщательно обдумать, действительно ли вам действительно нужно это множество индексов z…).