This is weird because I have another Mac desktop, and firefox (same version I guess).

On my web-game, I have 4 buttons:

“Play” : “Cars” : ‘Multiplayer” : “Download”

The page looks like this:

Edit: Live preview at parkingmaster.tk

The reason the buttons don’t look weird now is because I made a simple program that changes it on firefox.

But other OS’s have windows/linux, and it’ll look weird on there because the program isn’t specific enough (MacBook MacOS Big Sur).

This is what it looks like without that program:

As you can see the svg elements on the buttons are “Up”.

I tried changing the margin/padding, but then I found out it was the font-size css property.

It’s usually “45px” because that works on every other device, but on mac, it looks better with “51.5px” (that’s what the program does)

If this is a OS specific thing, how can I detect if the OS is “MacOS Big Sur” or specifically, the one I’m using (11.6.6)

TL;DR

In JavaScript, how can I check if the OS is “MacOS Big Sur/MacOS Big Sur 11.0.0+” and the browser is “FireFox Browser/FireFox Browser 90+”?