CSS unexpectedly changes when opening IE Developer Tools

I am currently testing the site on IE8 (runs on a virtual machine).

The site uses some background images inside: before and after the elements that are inside the media request:

@media (min-width: 980px) {

    .box:after {
        ...
        background: url('../images/assets/home-create-background.png') bottom right no-repeat;
        ...
    }
}

I use reply.js to provide support for media queries in IE8. The rules inside the media request apply as soon as the page loads (i.e.: response.js actually works). However, these images are not displayed.

The funny thing is: if I open IE Developer Tools (for example, by pressing F12), the images will suddenly display.

Has anyone experienced something similar? Do you guys have any idea or direction to study?


Edit: , , , : ( , - - IE)

    .box:after {
        ...
        background: url('../images/assets/home-create-background.png') bottom right no-repeat;
        content: " ";
        ...
    }

, , , , Dev Tools...

+5
1

IE , :

  • console.log() IE , .
  • IE Dev, , , .
+4

All Articles