Why CSS properties change in browsers [duplicate]

1

Why do I need to use different properties depending on the browser? For example:

FIREFOX

-moz-column-width:150px;

OTHER

-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.

    
asked by anonymous 14.02.2014 / 15:02

3 answers

5

What you're pointing to is called vendor prefix .

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

  • The W3C creates a specification.
  • Different vendors (Mozilla, WebKit, etc.) begin implementation; during this period vendor 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 the implementation are declared obsolete ( 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 maturity, 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 you are not practical reimplementing all code that has a mention of versions with vendor prefix - so they are kept for compatibility issues. This maintains an internal 'table' of resolution that redirects vendor-specific mentions to its final versions.

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

    
14.02.2014 / 15:11
3

This started when these properties began to be developed, in this way the had not yet made the settings on the properties.

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

Today you can see that there are several properties that in addition to having -moz- or -webkit- are also written without, such as border-radius for example, this means that has already standardized the property, so all browsers" have "to understand both their nomenclature and nomenclature from the .

    
14.02.2014 / 15:08
2

It's because these are properties that are used during the refinement 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 will accept the name given by the pattern.

Please note that there is no guarantee that the particular names of each brand will serve the purpose that the standard name proposes.

    
14.02.2014 / 15:05