fix: FluentDataGrid GenerateHeaderOption.Sticky not working in Chrome on iPad

[kostas-infolyseis]

🐛 Bug Report

When viewing a FluentDataGrid with the GenerateHeader parameter set to GenerateHeaderOption.Sticky, from mobile Chrome on an iPad the column headers do not stay on top of the containing element like they suppose to.

💻 Repro or Code Sample

Visit the demo site from an iPad device with Chrome , go to https://www.fluentui-blazor.net/DataGrid and see the FluentDataGrid example in the "Remote Data" section that uses GenerateHeaderOption.Sticky. The DataGrid headers do not stay on top.

🌍 Your Environment

• OS & Device: iPadOS 17.5.1 on iPad 8th generation
• Browser: Chrome 126.0.6478.108
• .NET and Fluent UI Blazor library Version [e.g. 8.0.6 and 4.8.0]

[vnbaaij]

Hi,

We are using the Fluent UI Web Components (not developed/maintained by this team) to render the data grid elements. These undergo rigorous testing to make them as compatible as possible on the different OSes and browsers but there might always be something that does not work exactly as expected in one of those combinations.

Unfortunately, we do not have capacity, possibility (I do not have an iPad to test on for example) nor opportunity (this is an issue in a downstream component) to address all of these. While I acknowledge that this is an issue, I am going to close this as 'not planned' because of the reason mentioned. Hope you can understand.

ps. We are happy to take on community contributions. If you are capable to find what (CSS) adjustments might be needed to fix this specific case, by all means please submit a PR for it.

[kostas-infolyseis]

@vnbaaij Thank you very much for taking the time to answer, I do understand and I appreciate the work you are doing. I will work on it a little bit more, as we use this component in our products, and as you said I will submit a PR once I have a solid solution.