Question

This CSS code does work in all browsers except FireFox. Why ? How can I fix it ?

.img_box {
  width: 110px;
  height: 160px;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url('https://www.google.com/images/srpr/logo3w.png');
}

Thanks in advance.

EDIT:
Here is the HTML that I want to use:

<img class="img_box" />

Answer 1

When Firefox encounters an image without a source, it replaces the image with its alt text. I personally find this extremely annoying, as it means I can’t test layouts unless I specifically create placeholder images, and should those images be unavailable for any reason the layout completely breaks.

Unfortunately, I have yet to find a solution to this problem.

In your case, however, you would be much better off using a div and adding display:inline-block to your CSS, instead of using an image.