Div с изображением внутри класса CSS не отображается в IE или Edge

Question

У меня есть div с классом css:

 .sideArrowImage {
    content:url('https://p41tarste2uscdn.blob.core.windows.net/cfc4678d-f1bd-42d0-93ba-b576ca0efc63/c114d41e-2e9d-4750-bcc6-84c587b7528c/media/images/non-resp%20arrow.png');
      }

  <div class="sideArrowImage"></div>

Изображение появляется в Opera / Firefox / Chrome.Это не появляется в IE11 или Edge.Как сделать так, чтобы изображение отображалось в IE11 или Edge?

Спасибо

Answer 1

Свойство content действительно только для псевдоэлементов :before и :after, вы должны использовать тег <img> или css background свойство .

---

.sideArrowImage {
  background:url('https://p41tarste2uscdn.blob.core.windows.net/cfc4678d-f1bd-42d0-93ba-b576ca0efc63/c114d41e-2e9d-4750-bcc6-84c587b7528c/media/images/non-resp%20arrow.png') no-repeat; 
  width:23px;
  height:23px;
 }

Img tag:<br>
<img src="https://p41tarste2uscdn.blob.core.windows.net/cfc4678d-f1bd-42d0-93ba-b576ca0efc63/c114d41e-2e9d-4750-bcc6-84c587b7528c/media/images/non-resp%20arrow.png" alt="=>" height="23" width="23">
<br><br>
Background CSS property:<br>
<div class="sideArrowImage"></div>