Как запретить всплытие событий через CSS

В CSS нельзя напрямую запретить всплытие событий (event bubbling), так как это поведение управляется JavaScript через event.stopPropagation(). Однако, можно имитировать блокировку взаимодействия с дочерними элементами, используя pointer-events: none.

Пример:

.parent {
  pointer-events: auto;
}

.child {
  pointer-events: none; /* Клики не будут достигать child */
}

Но учти:

1. Это полностью отключает взаимодействие с элементом (клики, ховеры и т.д.)
2. Не останавливает всплытие, если событие уже произошло на родителе
3. Альтернатива — JavaScript с e.stopPropagation() в обработчике