CSS - проблема с тенями

Question

Я работаю со свойством drop-shadow. Он отлично работает в браузерах, кроме Internet Explorer. Это важно, это работает в Internet Explorer 11 для меня. Что я могу сделать? Заранее спасибо.

.nb-view-project-image {
  max-width: 315px;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: #ff4040;
  filter: drop-shadow(5px 5px 5px #222);
  -webkit-filter: drop-shadow(5px 5px 5px #222);
  -ms-filte: drop-shadow(5px 5px 5px #222);
}

<div class="nb-view-project-image"></div>

Answer 1

Попробуйте это css:

.nb-view-project-image {
  max-width: 315px;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: #ff4040;
  box-shadow: 5px 5px 5px #222;  
}

Answer 2

Вы также можете попробовать использовать следующий код:

.nb-view-project-image {
    background: red;
    height: 100px;
    width: 100px;
    border-radius: 50px;
    margin: 20px;
    -webkit-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 1);
    -moz-box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 1);
    box-shadow: 2px 2px 5px 0px rgba(0, 0, 0, 1);
}

Answer 3

Попробуйте использовать:

-moz-box-shadow: #222 5px 5px 5px;
box-shadow: 5px 5px 5px #222;

Или:

-webkit-box-shadow: #222 5px 5px 5px;
box-shadow: 5px 5px 5px #222;