Как наложить картинку поверх ссылок так, чтобы они нажимались?

Question

[Kortez1337]

Верстаю макет сайта. В нем есть поверх всего body прозрачные изображения, наложенные сразу на несколько секций. Как можно их наложить так, чтоб не прописывать всем текстам, ссылкам и другим картинкам z-index? Проще говоря, чтоб картинки полупрозрачные были только визуально, а блока с ними не было и ничего не преграждало доступ к ссылкам? Такое возможно или нужно с z-index'ами париться? Сами прозрачные изображения вырезал как png. Как правильно реализовать такое наложение?

Делал вот так
position: relative;
  &:before
  {
    position: absolute;
    content: url(../img/leaf1.png);
    left: 0;
    top: 90px;
  }

Answer 1

[Aetae]

pointer-events: none

Comments

[Kortez1337]

Спасибо большое, решило проблему) Подозревал о таком свойстве :)

Answer 2

[Alex Pospeliri]

для псевдоэлемента &:before
position: absolute
left, top - задать !
content: ''
background-image: url("../img/leaf1.png")
width, height - обязательно задать !!!
background-position: 50% 50%;
background-size: 100% 100%;

Comments

[Kortez1337]

Не сработало, видно по курсору