Question about (New) Responsive Web Design> Learn Accessibility by Building a Quiz> Step 25

[ZWalrider]

Hello, I am a beginner and am not sure if it’s a problem, but in the Step 25 of the Learn Accessibility by Building a Quiz we’re tasked with the following:

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?

[bappyasif]

hello and welcome to fcc forum

perhaps this article can help:

• clip - CSS: Cascading Style Sheets | MDN

maybe this so link as well

• css - Hiding content accessibly now that clip is deprecated? - Stack Overflow

happy learning

[Sky020]

Welcome there,

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.

Hope this helps

[ZWalrider]

Thanks for the answers and for the ressources that are much appreciated!

[lasjorg]

As long as the browser is spec-compliant it will support the property.

Appendix A: The deprecated clip property

UAs must support the clip property.

For some legacy properties, they are aliased, like the old grid-gap property which is now part of a completely different specification.

8.4. Legacy Gap Properties: the grid-row-gap, grid-column-gap, and grid-gap properties

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).