Table: Only in Safari: Table occupies more space than needed

[xqtion]

Describe the bug

Hi,
we've encountered an interesting issue where the table occupies more space than needed only in the Safari Browser. This can be observed in the visual differences for the docs: https://sap.github.io/ui5-webcomponents-react/v2/?path=/docs/data-display-table--docs and especially here https://sap.github.io/ui5-webcomponents-react/v2/?path=/story/data-display-table--with-selection where the table will always load with an additional scroller bar.

Isolated Example

https://sap.github.io/ui5-webcomponents-react/v2/?path=/story/data-display-table--with-selection

Reproduction steps

1. Access both links above in Safari and Chrome Browser
2. For the docs, you can see that the table takes up more space overall
3. For the selection example, there will always be a scroller bar loaded in comparison to none for the Chrome version

Expected Behaviour

Consistency across browsers, especially because the not needed scroller bar would confuse the user in our application.

Screenshots or Videos

UI5 Web Components for React Version

2.8.1

UI5 Web Components Version

2.8.1

Browser

Safari

Operating System

macOS

Additional Context

No response

Relevant log output

Organization

No response

Declaration

• I’m not disclosing any internal or sensitive information.

[Lukas742]

Hi @xqtion

Thanks for reporting! I'll forward this issue to our UI5 Web Components Colleagues as the affected component is developed in their repository.

---

Hi Colleagues, it seems the height (height: -webkit-fill-available;) CSS property of this element is causing the issue.

Safari:

Chrome:

[s-todorova]

Hello colleagues ,

Could you please take a look at this?

Best,
Siyana