CODEWITHSUNDEEP
csswordpress
Raebow
Raebow

Reputation: 35

Wordpress background image not displaying - grayed out in Chrome inspector

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!

Upvotes: 2

Views: 133

Answers (2)

Vijaya Naidu Matha
Vijaya Naidu Matha

Reputation: 1

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

Upvotes: 0

s.kuznetsov
s.kuznetsov

Reputation: 15223

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;
}

Upvotes: 1

Related Questions