Firefox clip-path CSS code does not accept

Question

I am trying to build a round cycle avatar in my website. However, the clip-path cycles works for Chrome, Safari and IE9. I do not know why it does not work with Firefox. I am using Firefox 28.0.

My Chrome browser:

Firefox:

My CSS code:

.author-avatar img{
  height: 41px;
  left: -18px;
  position: relative;
  -webkit-clip-path: circle(50%, 50%, 30%);
  -moz-clip-path: circle(50%, 50%, 30%);
  clip-path: circle(50%, 50%, 30%);
}

Is a way to make the firefox looks the same?

Answer 1

For the circle image you can try adding the following to your css:

border-radius: 50%;