In Chrome, if input[list] with datalist is placed in a scrollable container, the datalist will remain at the same place after scroll, check out the example:
- Click the input, the datalist will appear,
Scroll the container
,- Get curious why the datalist didn't hide despite the input is not visible anymore.
That's it. Firefox and other browsers handle this situation without any troubles - datalist gets hidden on scroll.
So, the question is: is there any way to hide datalist on scroll even if it is in nested containers in Chrome?
Update: this bug is already filed, twice. Waiting for Chrome team for a resolution!