Firefox div pixelated background image not working

Question

I have a little problem. Image-rendering is not working on background image of div in Firefox but in Chrome it works fine.

How can I pixelate the background in Firefox too?

<div id="loadingScreen" class="loadingScreen">
    ...
</div>

.loadingScreen{
    position:fixed;
    top:0;
    left:0;
    z-index:50;
    width:100%;
    height:100%;
    background-color:#322007;
    background-image:url("../assets/textures/gui/menu_background.png");
    background-size:64px;
    image-rendering:pixelated;
    background-position:center;
}

Background image ->

Result with same code:

Answer 1

I think I solved it.

I've added a line with crisp-edges and it looks same. In Chrome only works with pixelated and in Firefox only with crisp-edges.

image-rendering: pixelated;
image-rendering: crisp-edges;