title: Why use specific vendor prefixes instead of one representing all browsers?
body: <p>As far as I know, the only reason behind usage of vendor prefixes is that they were introduced by browser creators to release a new specification before it's completely implemented according to W3C.</p>
  <p>But why do we need a specific vendor prefix for every browser?</p>
  <p>If we look at the following CSS,</p>
  <pre><code>.box{
     -webkit-box-shadow: 0 0 1px #000;
     -moz-box-shadow: 0 0 1px #000;
     -o-box-shadow: 0 0 1px #000;
     box-shadow: 0 0 1px #000;
  }
  </code></pre>
  <p>why can't this be written like the following?</p>
  <pre><code>.box{
     -vendor-box-shadow: 0 0 1px #000;
     box-shadow: 0 0 1px #000;
  }
  </code></pre>
  <p>Each individual browser, on seeing the prefix <code>-vendor-</code>, implements it in its own way.</p>
  <p>This not only makes it easy for developers, but also for browser creators as situations like Microsoft and <a href="https://en.wikipedia.org/wiki/Opera_%28web_browser%29" rel="nofollow noreferrer">Opera</a> compromised started supporting <code>-webkit-</code> because developers were lazy to use <code>-ms-</code> and <code>-o-</code> would never rise. If it was the case with <code>-vendor-</code> it applies to every browser.</p>
  <p>What is the explanation?</p>