z-index работает в IE, а не в Edge

Question

У меня есть div, к которому прикреплен класс css, для которого определен z-индекс. Это работало нормально для Chrome и Firefox, но не для IE. Мне пришлось поставить позицию: родственник с IE. Но тот же подход не работает с краем. Ничто не работает для Edge.

У меня есть что-то вроде кнопки, которая при нажатии открывает два элемента, один перекрывает другой. У одного, на котором я хочу быть, есть z-индекс 50, а у другого 20.

Нужно ли добавить какое-то другое свойство наряду с z-index, чтобы я работал над краем?

<div class="abc">
...
</div>

.abc{
z-index: 10;
}

У меня проблема с краем.

Answer 1

Свойство z-index работает только с элементами со значением позиции, отличным от статического (например, позиция: абсолютная; позиция: относительная; или позиция: фиксированная).

Есть также позиция: липкая; который поддерживается в Firefox, имеет префикс в Safari, некоторое время работал в старых версиях Chrome под пользовательским флагом и рассматривается Microsoft для добавления в их браузер Edge.

Благодаря Evert

Answer 2

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

Удаление этого отрицательного z-индекса исправило это для меня.

Answer 3

В caniuse и MDN это говорит о том, что z-index хорошо поддерживается обоим краем конца проводника. Вы уверены, что не существует другого конфликта, который explorer не воссоздает? Что случилось с Chrome и Firefox?