Чтобы не дать скрывать блок с абсолютным позиционированием относительно родительского компонента со скроллом, необходимо использовать правильные CSS свойства.
Если у родительского компонента есть свойство overflow: auto
или overflow: scroll
, а вложенный абсолютно спозиционированный блок уходит за границы родительского компонента при скроллинге, то стандартное поведение CSS заключается в том, что абсолютно спозиционированные элементы скрываются при достижении границ родительского блока со скроллом.
В таком случае, чтобы предотвратить скрытие блока, можно добавить следующие CSS свойства к родительскому компоненту:
position: relative; z-index: 1;
Свойство position: relative;
используется, чтобы создать контекст позиционирования для потомков с абсолютным позиционированием. Затем, свойство z-index: 1;
задает блоку родителя более высокий z-index
, чем у его дочерних элементов, позволяя им оставаться видимыми даже когда они находятся за пределами границы блока со скроллом.
Таким образом, при использовании вышеупомянутых CSS свойств для родительского компонента, блоки с абсолютным позиционированием не будут скрываться при скроллинге и останутся видимыми внутри родительского блока.