Local Background Image Not Loading

Question

This one seems simple but wont work for some reason. I have a background-image (locally) in css like this:

#header { background-image: url('/../img/students.jpg'); }
/*also tried this */ #header { background-image: url('../img/students.jpg'); }

But it wont load. Here is the directory structure:

---css
-------styles.css
---img
-------students.jpg

Anything I am missing?

Answer 1

This should have worked.

#header { 
    background-image: url('../img/students.jpg'); 
}

Also, this should work as well

#header { 
    background-image: url('/img/students.jpg'); 
}

My guess is that you're having some caching issues. Your first attempt was wrong, /../img/students.jpg goes one level above the document root, which is not possible. Maybe this css with this error has been cached by your browser, try hitting CTRL + F5 several times (or completly clear the browser's cache) once you have fixed your css file with one of the solutions above.