diff --git a/src/vaadin-grid.html b/src/vaadin-grid.html index 5532552ec..0ba24b36b 100644 --- a/src/vaadin-grid.html +++ b/src/vaadin-grid.html @@ -774,6 +774,17 @@ this.$.items.style.paddingBottom = `${this.$.footer.offsetHeight}px`; } } + + if (this._ios) { + const isOldIOS = !window.CSS.supports('position', 'sticky'); + if (isOldIOS) { + // Due to a rendering bug, the sticky header may disappear on an older iOS (10-12) Safari + // if the grid is used inside of a flex box. This is a workaround for the issue. + this.$.table.style.height = `${this.$.scroller.offsetHeight}px`; + this.$.table.style.minHeight = '100%'; + this.$.table.style.maxHeight = '100%'; + } + } } /**