Defines the background image's position relative to one of its edges. This syntax gives web authors a more flexible and responsive mechanisms to define the background image position, instead of using fixed values that need to be adapted to the window's or frame's size. This feature is applied also to the "-webkit-mask-position" to ensure webcompat levels are the same.
One important motivation is interoperability, given that Chrome is the only browser that lacks this syntax for the background-position-x/y longhands. Additionally, the background-position shorthand, which sets both the x/y positions, already supports the side-relative syntax, so the lack of the same syntax in the longhands may confuse web developers. There is no specific explainer, but this MDN page should be enough to understand the feature: https://developer.mozilla.org/en-US/docs/Web/CSS/background-position-x
Samples: https://developer.mozilla.org/en-US/docs/Web/CSS/background-position-x#try_it