I am little confused with argument order of css box-shadow property.
On https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow order is defined as follows:
box-shadow: inset(optional) <offset-x> <offset-y> <blur-radius> <spread-radius> <color>
Let's say we have it HTML like this:
<div style="box-shadow: inset 0px 0px 20px -4px rgb(0,0,0)"></div>
When I open developer tools, select above div element and execute following javascript why arguments are reordered. Color argument is now on first place instead of last one.
window.getComputedStyle($0).boxShadow
"rgb(0, 0, 0) 0px 0px 20px -4px inset"
Same with $($0).css("boxShadow")
The order mentioned in MDN is correct. It's the standard created for the developers to use.
That being said, what you looking at is the computed styles. Each browser and browser engines works differently, where mostly they try to combine, normalize or simplify the properties you give in a way that they understand better, which can help their processing faster/optimal.
The output you see is actually the reverse of the input you had given.