0

I am trying to insert a background image but for some reason when I put this...

html{
    background-image: url('images/background.png');
    background-repeat:no-repeat;
    background-size:100% 100%;
}

It doesn't seem to work, it stays blank. I know I have the path correct and the name correct I have only gone over it a million times, but when I put this...

html{
    background-image: url('http://i.imgur.com/GRqXyR1.png');
    background-repeat:no-repeat;
    background-size:100% 100%;
}

The background comes up fine. I am confused I don't understand why the first method isn't working?

4
Contributors
8
Replies
31
Views
3 Years
Discussion Span
Last Post by rtrethewey
1

Likely due to your path... images/background.png

That path wouldn't be relevant unless you are on a page at the root directory and your images folder is off the root.

If you use your browsers dev tools (F12), any errors in the network tab or console?

0

Well I thought the path might have been the problem so instead of putting it in a seperate folder I just turned the path into

html{
    background-image: url('background.png');
}

But it still didn't work, the other strange thing is that I have another html page that uses the same background and the CSS is the same, so I don't know why it isn't working.

0

Keep in mind that relative URLs in your stylesheet are based on the directory in which the stylesheet resides. If your stylesheet is in a subdirectory (like '/css' or '/styles'), then the rule should read something like:

    html{
    background-image: url('../images/background.png');
    background-repeat:no-repeat;
    background-size:100% 100%;
    }
0
body{
    background-image: url('../images/background.png');
    background-repeat:no-repeat;
    background-size:100% 100%;
    }
1

The page you linked to uses "\" as a directory delimiter in the URL paths for stylesheets and images, which doesn't work on UNIX-based servers. You need to use a "/" for URLs - even on Windows systems. Fix that problem first and then let us know when it's ready.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.