CSSでベンダープレフィックス以外の記述が同じになるのにベンダープレフィックスを付ける理由

Question

CSSでベンダープレフィックスを付けるよう推奨されているプロパティの中で、
ベンダープレフィックス以外の記述が同じになるものについての質問です。

ベンダープレフィックスを付ける理由を教えてください。

たとえばrotateを例にすると

div {
transform: rotate(45deg);
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}

のように、-ms-や-webkit-以外の部分はtransform: rotate(45deg);で全く同じです。
指定方法が変わるのであれば、ベンダープレフィックスが必要になるのは理解できるのですが、
指定方法が同じなのに付ける理由がわかりません。

Answer 1

指定方法が同じなのに付ける理由がわかりません。

ブラウザのバージョンによっては、-webkit-transformは認識するけどtransformは認識しない、という例があります。

Comments

[H40831]

ご回答ありがとうございました！
ベンダープレフィックスについて、勘違いしていました。
装飾子のように付けることで特定ブラウザのみにCSSを適用する機能のようなものだと思っていましたが、
回答を読んで、ただのプロパティ名と違いはないということに気づけました！

Answer 2

仮の話ですが…

EDGEがtransformの先行実装をしていて
W3C等の仕様策定予定のものを-ms-transformとして使える状況にしていました。

月日が流れtransformが正式に策定された時に、
MSがサボってEDGEでtransformがまだ使えずベンダープリフィックスが必要だった。

みたいな事があるかもしれません。
各ブラウザの実装進捗が大半だと思うのでベンダープレフィックス無しで動くなら外せば良いと思います。
仮にあっても無視されるだけなんで記述するかどうかはお好み…ですかね。

Comments

[H40831]

ご回答ありがとうございました！
ベンダープレフィックスについて、勘違いしていました。
装飾子のように付けることで特定ブラウザのみにCSSを適用する機能のようなものだと思っていましたが、
回答を読んで、ただのプロパティ名と違いはないということに気づけました！