We’re asked to use the “clip” property but I learned that this property is deprecated and being replaced by “clip-path”.
So my question is: Is it fine to keep using it in this instance or should I be using “clip-path” instead just in case?
After reading the Mozilla Docs on clip, I would advise to use clip-path in any code you write. You will likely see clip in many existing code. For example, I know Bootstrap still use it for their .sr-only.
The main thing to note about deprecations is that this does not mean the code stops working. This is especially true of the Web Development space, because majority of the APIs from early Internet Explorer days are still around; unlike other software, browser APIs are used, maintained, and supported for many years/versions.
The Grid Layout module was originally written with its own set of gutter properties, before all such properties were unified into the existing row-gap/column-gap naming. For compatibility with legacy content, those legacy property names must be supported as aliases:
grid-row-gap must be treated as a shorthand for the row-gap property
grid-column-gap must be treated as a shorthand for the column-gap property
grid-gap must be treated as a shorthand for the gap property
In all three cases, the legacy properties must take the same grammar as the property they are aliasing, and just “forward” the value to their aliased property.
As said, browser-based technologies have extremely strong backward compatibility. Pretty much once it’s in, it can never be removed (a bit of a curse and a blessing).