css z-index указатель-события

Question

Так что моя проблема в том, что я хочу, чтобы можно было нажимать .row, потому что его ширина заполняет окно, но не .fourcol, потому что в нем есть контент, такой как ссылки и изображения.Что-то мне не хватает в CSS?или я могу добиться этого с помощью jquery?

Мой CSS и HTML выглядит следующим образом:

<div class="container >
   <div class="row">
     <div class="fourcol>
       <p>Content</p>
     </div>
   </div>
</div>

Тогда у меня есть что-то под

<div class="drag">
<img src="image.png"/>
</div>

С помощью CSS:

.row {
width: 100%;
max-width: 1240px;
min-width: 755px;
overflow: hidden;
z-index: 1;
}

.fourcol {
z-index: 3;
}

Затем я позиционирую .drag с position: absolute; и z-index: 2; рядом с <p>content</p>

Спасибо, куча.

Answer 1

z-index работает только при наличии свойства position. Таким образом, z-index для .row ничего не сделает. Вам нужно добавить position: relative; как минимум. Затем добавление .drag div внутри .fourcol div с более высоким z-индексом должно привести к его появлению. Хотя вам может потребоваться использовать значение выше 2.