Due to how the polyfill is working, when we are writing code only for browsers which need to be fixed, the following code is supposed to work, but it doesn't currently:
.browsers-to-be-fixed div {
content: "images/stack.svg#icon-1";
width: 50px;
height: 50px;
background: no-repeat;
background-size: 100% 100%;
}
Instead, we have to redundantly add the value of background image in order to make it work:
.browsers-to-be-fixed div {
content: "images/stack.svg#icon-1";
width: 50px;
height: 50px;
background: url(images/stack.svg#icon-1) no-repeat;
background-size: 100% 100%;
}
The point is that, when we are writing code only for browsers which need to be fixed, we should be able to omit the value of background image because those browsers don't support the value anyway.
Due to how the polyfill is working, when we are writing code only for browsers which need to be fixed, the following code is supposed to work, but it doesn't currently:
Instead, we have to redundantly add the value of background image in order to make it work:
The point is that, when we are writing code only for browsers which need to be fixed, we should be able to omit the value of background image because those browsers don't support the value anyway.