Question

im using themes in an app im doing, and need a global css/img/js folder

i have tried using app/webroot as this folder, but cant get any css from a theme to show the images.

I have a setup like :: /app/views/themed/my_theme/webroot/css/file.css

With some css that looks like:

...
body{
     background-image: url('../img/file.jpg');
}
...

if i have the image in /app/views/themed/my_theme/webroot/img/file.jpg everything works 100% but when i put the image in /app/webroot/img/file.jpg it will not show. i have tried all sorts of combinations for the

i have also tried using a plugin dir like app/plugins/my_plugin/webroot/img/file.jpg but the various paths ive tried will not show the image either.

any ideas how i can get the image to show? i dont mind if its for webroot/ or in plugins/xyz/, just as long as i can use the same image in many different themes with out having to duplicate the images

when the image is in /webroot/img i can use the full path like url(http://locahost/my_app/img/file.jpg) and it works.

things that dont work

url(“img/file.jpg”)

url(“/img/file.jpg”)

url(“../img/file.jpg”)

url(“/../img/file.jpg”)

url(“../../img/file.jpg”)

thanks.

Answer 1

In your CSS file

body{
background-image: url('/img/file.jpg');
}

This will use the root area to find the image in /app/webroot/img/file.jpg