Vendor Prefixes in CSS

In the past, browsers had the following situation: before a CSS property appeared in the specification, browsers would implement a trial version of the property with a special prefix called a vendor prefix.

Let's use the property box-sizing as an example to see how it looks:

p {
	box-sizing: border-box;
}

This property was only supported since Firefox29, but since Firefox2 it was available with the -moz prefix:

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

The other browsers had similar prefixes: -moz - Mozilla Firefox, -webkit - browsers on the Webkit and Blink engines, -o - Opera on the Presto engine, -ms - IE.

Thus, the most cross-browser version of the box-sizing property, using vendor prefixes, looked something like this:

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

Currently, browsers have decided to abandon prefixes due to their inconvenience. And now they use the so-called flags instead. The properties are now embedded in the browser, but are disabled by default, but they can be enabled in the browser settings by checking the corresponding box in the settings. This is done so that developers have the opportunity to play with the new property before its official appearance.