CODEWITHSUNDEEP
sasscompass-sasssprite
abelb
abelb

Reputation: 51

Compass throwing in forward slash in front of images when making sprites

I am using Compass to create sprites. The sprites are being created but the css output is pointing to the wrong place for the images directory.

the output is:

.menu-sprite, .menu-about, .menu-art, .menu-drum, .menu-links, 
.menu-music, .menu-science, .menu-writing {
    background: url('/images/menu-sb7e36b009c.png') no-repeat;
}

but i want it to be:

.menu-sprite, .menu-about, .menu-art, .menu-drum, .menu-links, 
.menu-music, .menu-science, .menu-writing {
    background: url('images/menu-sb7e36b009c.png') no-repeat;
}

here is my confib.rb setup:

http_path = "/"
css_dir = "."
sass_dir = "sass"
images_dir = "images"
javascripts_dir = "js"

and here is how im calling the sprites in my scss file:

@import "compass/utilities/sprites/base";
@import "menu/*.png";
@include all-menu-sprites;

what am i doing wrong? How can i remove that first slash in front of images?

thanks for any help.

Upvotes: 5

Views: 1757

Answers (1)

Clark Pan
Clark Pan

Reputation: 6027

By default, compass uses absolute paths for all assets.

To change this behaviour, add this line to your config.rb:

relative_assets = true

Otherwise, you could also change the 'http_path' option to point to where your project sites on your deployment server.

Upvotes: 6

Related Questions