Why CSS properties change in browsers

Asked

Viewed 232 times

1

Why is there a need to use different properties depending on the browser? For example:

FIREFOX

-moz-column-width:150px;

ANOTHER

-webkit-column-width:150px;

There are many other cases, but what I want to know is why it is not simply "column-width" and if other browsers do not understand all.

css

3 answers

5


What you’re pointing at is called prefix vendor.

Briefly, this happens because the process of adding a new specification occurs independently between implementations. The process usually occurs as follows:

  • The W3C (World Wide Web Consortium) creates a specification.
  • Different vendors (Mozilla, Webkit, etc.) start the implementation; during this period prefixes are used in order to help identify different behaviors;
  • The default is finalized, the final format is established, and vendor relative prefixes used during implementation are declared obsolete (English deprecated).

A practical example:

  • border-radius is discussed and suggested in 2012.
  • -webkit-border-radius is implemented for Safari 3-4, iOS 1-3.2 and Android 1.6;
  • -moz-border-radius is implemented and used in Firefox 1-3.6;
  • After a period of maturing, border-radius is considered established and available for Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4 and Android 2.1+.

The problem is that it is not practical to reimplement every code that has a mention to the versions with vendor prefix - so they are maintained for compatibility reasons. With this, an internal resolution 'table' is maintained that redirects mentions vendor-specific for its final versions.

To avoid the bloating effect, companies like Google plan to monitor the use of certain CSS tags and predict the impact of removing obsolete content.

  • But the tendency is that with time they fall into disuse, are depreciated and finally discontinued.

3

This started when these properties began to be developed, thus the had not yet made the definitions on the properties.

So the producers of each browser started using names that related the properties to their browsers as a way of not conflicting the interpretation of this property with other browsers they were called prefix vendor.

Today you can see that there are several properties that besides having the -moz- or -webkit- are also written without, as the border-radius for example, this means that the has already standardized the property, so every browser "has to" understand both its nomenclature and the nomenclature of .

2

This is because these are properties used during the improvement of the browser code, so that once everything is perfect, the names recommended by the standards are used.

This means that at a given point, the browser now accepts the name indicated by the default.

Note that there is no guarantee that the particular names of each brand, serve for the purpose that the standardized name proposes.

Browser other questions tagged css

You are not signed in. Login or sign up in order to post.