On this page I can see a background image and a linear gradient in FF, but I cannot see it in Chrome.
I do see that the <section> it is in does have a ‘fixed’ position. I tried removing/replacing that within the Browser Developer Console, but it didn’t make any difference to display the background image/gradient.
Do any of you see any other reasons for these to not show up?
There appears to be a stray close </p> tag in the HTML (line 336). Try deleting it and see if that helps.
Hmmmm. It seems to be part of a paragraph inside of a paragraph, which doesn’t make sense. You will probably need to delete the opening paragraph tag on the line above it, too.
You sound a bit casual about the observation, but as it happens, the section about the Special Event is the first one that failed in Chrome for me. I also noticed that the HTML in that section is entirely different from the HTML in the preceeding working sections. Just another observation.
After finagling with it for about an hour, I figured out that ‘background-image’ was being set when it should have been ‘background’. I then reset the gradient layering by just using linear-gradient and both FF and Chrome seem to be pretty happy with it.
Thank you for the heads up regarding ‘p’ tag error. I wouldn’t have noticed it before.
It can be easy to create errors without ever noticing them. That’s why you should make a habit of regularly validating code during production and before publication.
It will spot the things you never notice.