CODEWITHSUNDEEP
csscross-browser
Mohsen Safari
Mohsen Safari

Reputation: 6795

What mind is behind this prioritize of CSS3 cross browser?

What mind is behind this prioritize of CSS3 cross browser?

for example:

.box_scale {
  -webkit-transform: scale(0.8);  /* Chrome, Safari 3.1+ */
     -moz-transform: scale(0.8);  /* Firefox 3.5+ */
      -ms-transform: scale(0.8);  /* IE 9 */
       -o-transform: scale(0.8);  /* Opera 10.50-12.00 */
          transform: scale(0.8);  /* Firefox 16+, IE 10+, Opera 12.10+ */
}

first is -webkit-, second is -moz-, third is -ms- forth is -o- and at the end without any prefix. what is the point of this prioritize ? or this is not matter which one is first?

Upvotes: 0

Views: 51

Answers (3)

Ashkan Mobayen Khiabani
Ashkan Mobayen Khiabani

Reputation: 34160

Well as browsers ignore css codes they don't understand, so the order is not important. browser will use the one it understands and will ignore the others.

Upvotes: 0

BenM
BenM

Reputation: 53198

The order is irrelevant as the selectors target specific browsers. Most people chose this method purely because it looks better than writing them without tabs.

Upvotes: 0

BoltClock
BoltClock

Reputation: 723688

You can see an inverted staircase in the property names, starting with the longest (-webkit-) and ending with the shortest (-o-) and the unprefixed property, supported by indenting the declarations so that the colons and values line up.

Other than that there is no practical meaning to the order of prefixes — you can mix and match the order of your prefixes however you like, with one exception: the unprefixed property always comes last because it's the standardized version of the property, and you want browsers to choose to use that over their prefixed version to ensure you get the most standards-compliant behavior for that property.

Upvotes: 4

Related Questions