Relative paths in CSS

Jul 17, 2013 at 6:35 PM
I'm new to minifying. I minify several .css in differents paths, but images lose the relative path (i.e. images are not loaded by the browser).
For example...
/folder1/css1.css
/folder1/image1.png
/folder2/css22.css
/folder1/image2.png
/newcss.min.css <--

How do I solve this without modifying each css file with the absolute path?
Thanks!
Coordinator
Jul 17, 2013 at 6:57 PM
Seems like an oversight on my part. AjaxMin should figure out any relative-path delta between the input file and the output file and location and adjust any generated relative paths accordingly. It's not doing anything of the sort right now (obviously). Unfortunately right now, there are really only three options I can suggest:
  1. add a build task that copies all the input images to the output folder, or
  2. Structure the sources and the output such that relative paths remain intact. For example:
    /Folder1/css1.css (contains reference to ..\Images\image1.png)
    /Folder2/css2.css (contains reference to ..\Images\image2.png)
    /Images/image1.png
    /Images/image2.png
    /Minified/newcss.min.css (contains references to ..\Images\image1.png and ..\Images\image2.png).
Not the greatest solution, I know, and I apologize for that. The CSS parser/minifier in AjaxMin is pretty rudimentary as best. I might suggest taking a look at WebGrease -- not only does it do a better job optimizing CSS, it also does automatic spriting and hashing of file names for better cacheing. It should be able to take care of this specific issue no problem. I'm not sure when or if I'll be able to adjust AjaxMin to fix this particular issue.
Jul 18, 2013 at 11:44 AM
Thanks a lot for your time. I'll evaluate the solutions.