I have a background image(Our Mission & Vision) that doesn’t seem to be displaying in Chrome (40.0.2214.93). Chrome displays the body background color of #FFF, but not the image I’ve chosen UNLESS I’m viewing the code in Firebug then the background just suddenly appears.
I selected elements (the vision text) AND elements around it and I couldn’t find any element that supposedly had a background image on it. Was I looking in the wrong place?
PS - I have the same Chrome version but I didn’t see any magic image appear when I did inspect elements.
Really do try and fix those validation errors though.
Edit - went back and now the image is there.
Edit2 - Refreshed and now it’s staying there 100% of the time.
The image wasn’t there before but seems to be in place now although it isn’t working as a fixed element any more because of the backface visibility rule on the body element.
body{
-webkit-backface-visibility: hidden;
}
Unfortunately in webkit any child of that rule will lose its fixed position. I’ve written about this before.
RyanReese:
A lot of those validation errors are interesting to see, even though some–if not most–seem to possess valid CSS markup based upon W3C. This is rather odd. I did, however, come across some invalid markup and fixed some of that. Thank you for pointing that out.
PaulOB:
So I’m better off just removing the ‘fixed’ background attachment just to make all browsers happy. Good enough! Looks good anyways! It’s the first time I’ve ever encountered such a hiccup, but then I wasn’t combining animations in the container either at those times.
The -webkit-, -moz-, and -o- extension ones you can ignore, but other than that most of those errors could be fixed. I see some major bracket errors too.