Как выбрать z-index

8 декабря 2011 г. #верстка

Часто на одной страничке появляется много разных интерактивных элементов, каждый из которых нужно расположить на конкретном уровне. Этим расположением нужно управлять и сразу помещать каждый элемент на конкретный этаж z-index.

Обычно у меня получаются следующие уровни:

0-9 — для случаев, когда надо, чтобы один обычный блок перекрыл другой такой же обычный. Например нижний блок должен наехать на верхний, у которого уже стоит position: relative.
10-99 — для дропдаунов, тултипов, автодополнений и прочих элементов, которые и должны быть выше остальных, но и выше них что-то еще может быть.
100 — оверлей, полупрозрачный блок, располагающийся над всем сайтом, но под попапом. Он, как правило, всего один и ему выделяем один z-index.
101+ — попапы, индикаторы глобальной загрузки веб-приложения.