CODEWITHSUNDEEP
csswebkit
Archisman Panigrahi
Archisman Panigrahi

Reputation: 633

Why add -webkit- prefix in CSS when things still work without it?

background: linear-gradient(#0081D3, #E44211); just works fine in most modern browsers.

Why are -webkit-linear-gradient, -moz-linear-gradient etc. used sometimes?

Upvotes: 1

Views: 336

Answers (2)

Hashem Qolami
Hashem Qolami

Reputation: 99464

Vendor prefixes such as -webkit- or -moz- are used to add new features that may not be part of a formal specification, to add support for new CSS features in a sort of testing and experimentation period.
- reference

Web browser makers uses these prefixes for CSS experimental features, hence the old browsers may support new CSS features under the vendor prefix.

While the syntax of a CSS feature (e.g. gradient) could be different between the vendor implementation and the formal specification:

/* Old syntax for Safari 4+, Chrome 1-9 */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1e5799), color-stop(100%,#7db9e8));

/* W3C Spec */
background: linear-gradient(to bottom, #1e5799 0%,#7db9e8 100%);

Check the MDN or WebPlatform doc for further information.

Upvotes: 2

Jonas
Jonas

Reputation: 1

They are called "Vendor Prefixes" and you need them for compatibility with older browseres. CSS3 is a changing standard, so some functions are not implemented without these prefixes when the developers are still working on them.

You have to think about the older browsers because they are still used by many people.

See this for more information: http://css-tricks.com/how-to-deal-with-vendor-prefixes/

Upvotes: 0

Related Questions