Akryum / Akryum/vue-virtual-scroller

Unable to make elements sticky due to overflow: hidden under the hood of DynamicScroller

Abierto
#811 3 comentarios 2 reacciones 0 asignados Ver en GitHub
help wanted
Lenguaje dominante
TypeScript
Estrellas
10.8k
Forks
973
Métricas de merge de PR
Sin PR fusionados en 30 d

Descripción

### Describe the bug

I create a table where each row is wrapped by DynamicScrollerItem. My task is to do a sticky column. I use `position: sticky` to make specific cells sticky.

The problem is `position: sticky` doesn't work if any of sticky element parents have `overflow: hidden`.

Element with class `vue-recycle-scroller__item-wrapper` which is under the hood of vue-virtual-scroller has `overflow: hidden` that makes impossible to make sticky elements inside it.

### Reproduction

Create simple table using DynamicScroller. Try to make any column sticky.

Expected result:
Cells of sepcific column are sticky.

Actual result:
`position sticky` doesn't work due to `overflow: hidden` under the hood of vue-virtual-scroller.

### System Info

```shell
Not required.
```

### Used Package Manager

npm

### Validations

- [X] Read the [docs](https://github.com/Akryum/vue-virtual-scroller/blob/master/packages/vue-virtual-scroller/README.md).
- [X] Check that there isn't [already an issue](https://github.com/Akryum/vue-virtual-scroller/issues) that reports the same bug to avoid creating a duplicate.
- [X] Check that this is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/Akryum/vue-virtual-scroller/discussions).
- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.

Guía de contribución

No hay ninguna guía de contribución indexada para este repositorio

Evaluación

Este issue todavía no se ha evaluado.

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.