Button margin different between Chrome Windows and IOS Safari

[tagdara]

What package has an issue

@mantine/core

Describe the bug

When using buttons that are tightly spaced or should have zero space between them, the results are different between Mobile safari and Chrome on Windows.

This seems to be because of margin: 0 2px that appears on the button in Safari but not in Chrome. I cannot see where this style is applied in the dev tools, however when I style the button to include "margin: 0", the problem is resolved and the display is consistent on both platforms.

On a row with a lot of buttons, this can also cause horizontal overflow that is difficult to troubleshoot on desktop, as it looks different in the Chrome dev tools (I had to fire up Inspect.dev to figure this out).

It sounds similar to issue: https://github.com/mantinedev/mantine/issues/364, and I don't have normalize.css in my project (and can't add it at the moment to double-check).

In which browser did the problem occur

IOS 15.x Safari

If possible, please include a link to a codesandbox with the reproduced problem

No response

Do you know how to fix the issue

No

Are you willing to participate in fixing this issue and create a pull request with the fix

No response

Possible fix

No response

[rtivital]

Cannot reproduce in Safari with normalize css, looks the same as in desktop chrome https://codesandbox.io/s/boring-violet-eguitq?file=/src/App.tsx