Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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.

like image 335
abelb Avatar asked May 26 '12 19:05

abelb


1 Answers

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.

like image 118
Clark Pan Avatar answered Sep 30 '22 08:09

Clark Pan