6.0.2: What is the proper way to handle the CSS property "background-image"

You should use a path that is relative to the html/jsp/css file, like "top_body_bg.jpg". The absolute path that includes the context-path is gonna bite you anyway when context-path changes.

Sascha

The downside to that is that it will break when you move things around.

I usually use absolute, context-specific paths everywhere, but without hardcoding
the context.
There are two approaches:
1) The JSTL <c:url> tag for links/URLs
The downside is its verbosity: the 'syntax noise' quickly adds up for
larger pages.
2) At start of page:
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
After that, you can use paths like "$/foo/bar" everywhere.

The downside to that is that it will break when you move things around.

Hmm, it shouldn't. I've never tried this one actually, but as long as you use IDEA to move things around the paths should stay valid (and relative), although there have been bugs that either forgot to update the paths or inserted absolute ones.

BTW: Does IDEA recognize and update the filename built with <c:url> when moving the file?

Sascha

This is all wonderful feedback, however - this graphic file reference is inside a .css file, not on a .jsp page.

It doesn't matter, as long as the path you specify for the image is relative to your .css file. If the .css file is in / and the image is in /resources, this will work:

.body {
background-image: url( resources/top_body_bg.jpg );
}

Sascha

Hello Todd,

This is all wonderful feedback, however - this graphic file reference
is inside a .css file, not on a .jsp page.

You're right, I missed the CSS bit from your original message.
After reading it again I agree with the comments that Sascha gave.

That is not working for me. To be clear, the css works, but for some reason, I'm still receiving the error (same as listed above). Here's the css line in question:

background-image: url( /img/arrow_down.png );

And here's the error:

"Cannot resolve file or web directory element or directory 'img'"

The letters "img" are error highlighted in red.

Note, IDEA has no problem auto-completing the path to the file via CTRL+SPACE, but no matter what I do (no quotes, single quotes, double quotes), it balks at anything in my css file that takes the form of:

background-image: url( /img/arrow_down.png );

Hello jonathan,

That is not working for me. To be clear, the css works, but for some
reason, I'm still receiving the error (same as listed above). Here's
the css line in question:

background-image: url( /img/arrow_down.png );

And here's the error:

"Cannot resolve file or web directory element or directory 'img'"

The letters "img" are error highlighted in red.

Note, IDEA has no problem auto-completing the path to the file via
CTRL+SPACE, but no matter what I do (no quotes, single quotes, double
quotes), it balks at anything in my css file that takes the form of:

background-image: url( /img/arrow_down.png );

I'm using IDEA 7.0.4 EAP and FireFox 2.0.0.14. For me url("/img/picture.gif")
is not resolved in browser. Written in this form: url("img/picture.gif")
or in this: url("./img/picture.gif") it is resolved. So, the browser probably
consider the starting slash as the sign of "absolute path" or something.

IDEA does not show me error in any of listed cases. All CSS inspections are
turned On.

Anyway, maybe erasing the starting slash helps you?

Alexander.

Nope, erasing the starting slash does nothing for me. The only cases I've determined where IDEA does not give me an error are either a) the url references a file in the same directory (no preceding "/" or ".") or b) the url is absolute and starts with 'http://'. And I'll repeat for clarity: My problems isn't with getting the css to work, it's with IDEA's false positive error highlighting.

Any other ideas?

hi
my project has src folder with html & css files

src/trunk/www-ru/* - html
src/trunk/www-ru/css/ - css
src/trunk/www-ru/i/ - images

i see - validator error on line
.abc {
    background:url('/i/icons_8_black.png');
}

if i move folder i (from src/trunk/www-ru/i/) to folder src/i , validator don't show error.

how to resolve problem without moving "i" folder?

thanks
file / project sructure / modules / sourses