Vendor extension superfluous on Chrome and not working in Firefox

Question

I've been playing around with the code below, and there are two things i don't quite get. The first one is that Chrome seems to accept the vendorless radius specification. So why should we put in "-webkit" there?

-webkit-border-radius: 10px;
-moz-border-radius: 20px;
border-radius: 30px;

I also noticed that the very same commands have no effect in Firefox. The border corner stays sharp. Am i missing something about vendor extensions?

HTML

<div class="blobb">
<form id="myForm" runat="server">
  <input id="info" type="text" placeholder="Info" />
</form>
</div>

CSS

div.blobb{
  width: 200px;
  height: 100px;
  padding: 15px 25px 0 25px;
  margin: 15px 0px 15px 30px;
  cursor: default;

  border: 1px solid #666666;
  background-color: #ccaa99;

  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
}

Answer 1

Chrome switched from the -webkit- to the unprefixed name in version 5. Firefox switched from -moz- to the unprefixed name in version 4. Details here: caniuse.com/border-radius – Šime Vidas Jul 29 at 13:03