Wordpress background image not displaying - grayed out in Chrome inspector

user_14180223 0
Viewed 74

I cannot get this background image to display on the body or any divs at all on my wordpress demo site. I have tried everything from adding !important to the css, to changing the css into an id and class in an effort to get it to display. I also uploaded it to a remote server to see if my local server was the issue, since it worked on the static site before. No matter what I’ve done, it shows as grayed out in the inspector. I’ve even looked on Firefox to see if it was a Chrome issue.

Image of my Inspector

Here is the code I am using:

body{
background-image: url(‘wp-content/themes/jjspizza/assets/images/tie-dye_fade.jpg’);
background-size: cover;
font-family: ‘Open Sans’, sans-serif;
}

And here is the code on the live server: https://demo.jjs-pizza.com/

I’m sure it’s something incredibly easy, I just don’t know what else to try. Thank you in advance for any help!

wordpress css
2 Answers

This is how it will work. As a result, it should be like this:

background-image: url('../assets/images/tie-dye_fade.jpg');

the complete body tag code should look like this:

body {
    background-image: url('../assets/images/tie-dye_fade.jpg');
    background-size: cover;
    font-family: 'Open Sans', sans-serif;
}
user_135734440

mostly like above background-image: url('../assets/images/tie-dye_fade.jpg'); it will work if not remove that "../" so it will be work

body {
background-image: url('assets/images/tie-dye_fade.jpg');
background-size: cover;
font-family: 'Open Sans', sans-serif;}

if style sheet any css folder you have to use ../ else you have to use just like this assets/images/tie-dye_fade.jpg

user_141820690
Related