Как совместить overflow: hidden; и position: sticky?

Question

[wakenbyWork]

Есть макет, в одной секции используется position: sticky, а по всей странице есть элементы, которые выходят за экран с правой стороны. И все это нужно как то совместить.

Я обернул все содержимое body, в .wrapper, и задал ему overflow: hidden; Но тогда ломается весь position: sticky;

Как можно избавиться от горизонтального скролла на странце из за элементов которые выходят за экран, и сохранать sticky?

Comments

[Ankhena]

Напрашивается идея обернуть во wrapper всё кроме sticky

[wakenbyWork]

Ankhena, Тоже так захотел, но на фоне этой секции тоже есть этот круг.

В итоге выгрузил этот круг обрезанный из figma. Почему сразу так не сделал, такие круги выгружались и в браузере обрезались по бокам. Приходилось blur докидывать с верху. Сейчас похоже круги сделаны лучше, или figma пофиксила это))

[Ankhena]

wakenbyWork,

Тоже так захотел, но на фоне этой секции тоже есть этот круг.

Ну и почему нельзя ей тоже задать overflow?

Ну либо наложить блок со sticky поверх блока с фоном