0

I have a div with fixed background-image in it. Somehow this works on Firefox and IE 11 but on chrome the div doesn't show up.

Her the example in jsfiddle: jsfiddle

The question might be similar to that one here:

chrome fixed background issue

but what they tried to achive is a litte bit different: They have the background-image on the whole section and put the content over that. so none of the solutions worked for me. Beside that the Demo in codepen there, doesn't even work in Firefox?

There are 2 soutions that come in my mind:

  1. use the hack that was mentioned:

@media screen and (-webkit-min-device-pixel-ratio:0) {
  .bg{
      background-attachment: scroll;
}
}

by that the image will be displayed in chrome but not fixed, so you will not have the same effect as in Firefox and IE.

  1. to try something completely different by reordering the divs

    fancy stuff

this one seems to be some fancy stuff which i have never tried before and don't even know if this is going to work. maybe it will bring more problems as solutions??

Any idea how to fix this? Am I missing something?

Community
  • 1
  • 1
TheShah
  • 61
  • 5

1 Answers1

0

If you remove

 will-change: transform;

the background will show up.

gre_gor
  • 6,669
  • 9
  • 47
  • 52
  • that fixed the problem, tnx. But as i tried it on the whole project it was broken again. i will update my question maybe it is helpfull for others. – TheShah Oct 17 '15 at 19:41