Why write the same CSS property for every browser?

Question

css

I often see entries of the following nature:
-webkit-transition: opacity 0.5s ease;
-moz-transition: opacity 0.5s ease;
-o-transition: opacity 0.5s ease;
transition: opacity 0.5s
I took the property transition and opacity as an example, I'm wondering why list -webkit, -moz, -o when the last (just transition) property is supported by all of the above browsers? I would also understand if the values ​​​​for each browser would be different, but if it is the same ...

Answer 1

The bottom line is that often new features appear in browsers with vendor prefixes, and only in later versions support without a prefix appears, so for such old versions they are added. By the way, some fresh properties can even support the latest versions of browsers only with prefixes. So it's up to you to add prefixes or not. If you use sass, you can create mixins for automation.

Answer 2

the last (just a transition) property - do all of the above browsers support it?

If this were true, then indeed, there would be no point in specifying vendor prefixes. But it's not.
caniuse.com/#feat=css-transitions Deciding
whether or not to use vendor prefixes depends on the project and the minimum supported browser versions.
PS Today there was already a question on this subject.

Answer 3

This is a fallback for older versions of browsers. The property is written last without prefixes so that it overlaps the rest.