Радиальный градиент компаса выглядит неправильно в IE и Firefox

Я пытаюсь создать радиальный градиент с помощью компаса, и он отлично отображается в хроме, но когда я просматриваю его в firefox или IE, градиент возвращается к кругу, а не к удлиненному эллипсу.

Это то, что я пробовал.

  @mixin radial-shadow-horizontal-rule(){
     height: 5px;
     @include background-image(radial-gradient(50% 0%, 50% -5px, rgba(150,150,150,0.4) 0%, white 100%));
  }

  .radial-gradient{
     @include  radial-shadow-horizontal-rule();
  }

HTML

<div class="radial-gradient"></div>

Любая помощь будет чертовски прекрасной.