Prefiksy vendorów w CSS

W przeszłości wśród przeglądarek zaistniała następująca sytuacja: zanim właściwość CSS pojawiła się w specyfikacji, przeglądarki implementowały wersję próbną tej właściwości ze specjalnym przedrostkiem, który nazywa się prefiksem vendorów.

Spójrzmy na przykładzie właściwości box-sizing jak to wygląda:

cssp {
  box-sizing: border-box;
}

Ta właściwość zaczęła być wspierana dopiero od Firefox29, jednak już od wersji Firefox2 była dostępna z prefiksem -moz:

cssp {
  -moz-box-sizing: border-box;
}

Pozostałe przeglądarki miały analogiczne przedrostki: -moz - Mozilla Firefox, -webkit - przeglądarki na silniku Webkit i Blink, -o - Opera na silniku Presto, -ms - IE.

Zatem najbardziej cross-browserowa wersja właściwości box-sizing, z użyciem prefiksów vendorów, miała mniej więcej następujący wygląd:

cssp {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
}

Obecnie przeglądarki zrezygnowały z prefiksów z powodu ich niewygodności. Zamiast nich używa się tak zwane flagi. Właściwości są teraz wdrażane w przeglądarce, ale domyślnie wyłączone, jednak można je włączyć w ustawieniach przeglądarki, zaznaczając odpowiednią opcję w ustawieniach. Zrobiono to po to, aby deweloperzy mogli pobawić się nową właściwością zanim pojawi się ona oficjalnie.