I know that the path needs to be relative to the CSS file.
Developing with sass, as well using the Bones template/framework for WordPress. The file layout is like so:
localhost/wordpress
— wp-content
— — themes
— — — hs-theme
— — — — library
— — — — — css
— — — — — — ‘style.css’
— — — — — scss
— — — — — — breakpoints
— — — — — — — ‘_1030up.scss’
— — — — — images
— — — — — — ‘header.jpg’
I’m modifying the header class with some code in _1030up.scss, which is getting ported to style.css.
.header {
background-color: $blue;
background-image: url(../images/header.jpg) no-repeat;
}
However, the header image is not being displayed and the selector isn’t even showing up in Firebug.
Check the path that your rendered CSS files are actually being stored in. In some app platforms, LESS or SASS will compile to some static assets folder (in the case of WP, maybe /wp-content/uploads or similar), which would affect the paths you need to set.
You can also use a root relative path, e.g., ‘/wp-content/themes/theme_name/images/image.jpg’ instead of a directory relative path as you are now.
Try:
Your path is correct, try putting
''around it like so:background-image: url('../images/header.jpg') no-repeat;