Блок закрывает видимость?

Question

[Vadim Stepanenko]

Имеем примерно такую картину


Блок с квадратами закрывает текст

И например, если там будет кнопка, пользователь не сможет нажать на нее.

Есть ли варианты решения проблемы?
Пока решение вижу только в навешивании позиционирования не родителю квадратов, а каждому квадрату. Но тогда если у зеленого, к примеру поменяется высота, то она будет наезжать на красный.

upd. В квадратах будут кнопки

Answer 1

[Vitaliy]

.controls {
  pointer-events: none;
}

Comments

[Vadim Stepanenko]

но в этом блоке будут так же кнопки находится, на которые нужно кликать
в том то и проблема

[Сергей delphinpro]

Vadim Stepanenko, на этих кнопках pointer-events: all;

[Vadim Stepanenko]

Сергей delphinpro, спасибо

Answer 2

[Stalker_RED]

Сделайте этот прозрачный блок прозрачным и для кликов.
pointer-events: none
https://developer.mozilla.org/ru/docs/Web/CSS/poin...

Ну или можно зеленый сделать родителем красного, например. А от прозрачного блока избавиться вовсе.
Или сделать общего родителя с нулевой высотой.

Comments

[Vadim Stepanenko]

но в этом блоке будут так же кнопки находится, на которые нужно кликать
в том то и проблема

[Stalker_RED]

Vadim Stepanenko, возможно я не понимаю в чем именно проблема. Опишите подробнее, что вас не устраивает в этих блоках.