(так надо)
не будет правильно работать
e.stopPropagation()
относительно позиционирование реагирует на то, чтобы быть сдвинутым вниз на отступ bodyпозиционирование не играт ни какой роли, в данном случае блоки сдвинулись вниз из-за того что мы поставили padding-top 100vh для body, он то и сдвинул весь поток вниз, кроме первого блока, т.к. он вне потока из-за position fixed
статическая позиция и индекс не смогли решить мою проблемуz-index на элементе у которого posirion static - не имеет никакого эффекта, чтобы z-index заработал нужно создать на блоке контекст наложения. контекст налождения у блока создают ряд свойств, среди которых есть свойство position с любым значение кроме static(оно же значение по умолчанию). блок с контекстом всегда будет выше(по оси Z) блока без контекста. именно поэтому ваш первый красный блок перекрыл остальные блоки, т.к. у красного был контекст(position fixed), а у остальных не было. поставив position relative двум последним блокам мы создали им контекст и они перестали перкрываться красным блоком. почему в конкретно этом примере не нужен z-index? потому что блоки с контекстами и без z-index перкрывают друг друга в том порядке в ктором они опредены в разметке. в вашем случае красный блок ниже всех, второй - жеотый, третий - зеленый
