Evans Evans - 3 months ago 14
Sass (Sass) Question

Image paths in SASS file which has been included?

Im my project I have a main SASS file in the root. I also have a folder with _other.sass and icon.png in it.

main.sass
folder/_other.sass
folder/icon.png


My main SASS file includes my other SASS file:

In main.sass:

@include 'folder/other'


In _other.sass:

div {
background: url(icon.png);
}


Should the path to the image resolve correctly in this case? From the point of view of _other.sass the path is correct, but its not correct relative to main.sass.

Answer

Since all the compiled code will be included in your final *.css file, all urls must be relative to that resulting *.css file. In the code you have posted, the url is assigned as regular css code, so it wont be transformed in any way.

If you would use compass, what is a great extension to sass, you can use the provided functions, f. i. those to generate the needed urls. With compass you can configure all the base paths and the stuff alike, sass itself wont do that for you.

Comments