CODEWITHSUNDEEP
javahtmlcssjsptomcat
Greg
Greg

Reputation: 41

JSP with CSS does not display the background image

I have the following directory structure

structure http://img853.imageshack.us/img853/7092/96816871.jpg

My CSS tries to use an image as a background

#search-text {
width: 213px;
height: 28px;
padding: 6px 0 0 7px;
border: none;
background: url(../images/img02.jpg) no-repeat left top;
color: #000000;

}

and it doesn't work while other parts of css work fine.

Firebug shows that application tries to access image by URL _http://localhost:8080/images/img02.jpg and gets 404 error

When I try to access image directly I also get this error. Also I tried _http://localhost:8080/paygate/images/img02.jpg _http://localhost:8080/paygate/resources/images/img02.jpg ...and this error doesn't stop follow me.

When I've changed my CSS file to the following

background: url(images/img02.jpg) no-repeat left top;

warning appeared in webserver log:

WARN : org.springframework.web.servlet.PageNotFound - No mapping found for HTTP request with URI [/paygate/images/img02.jpg] in DispatcherServlet with name 'appServlet'

and Firebug showed 404 error for URL _http://localhost:8080/paygate/images/img02.jpg

How should I organize my directory structure or what should I do to make my images accessible. Thank's!

P.S. I'm using springsource tc server as a webserver.

Upvotes: 4

Views: 14381

Answers (2)

BalusC
BalusC

Reputation: 1108802

Static resources are supposed to be served by the container's default servlet. However whenever you map any servlet on an URL pattern of / or /* in your webapp, then the default servlet will be completely overridden. You don't want to have that. Map the Spring dispatcher servlet on a more specific URL pattern, e.g. /app/* or *.html or whatever. If you don't want to have changes in the URL, then you need to put static resources in a fixed folder like /static and create a Filter which will forward the non-static resources to the Spring dispatcher servlet.

See also:

Upvotes: 2

Genzer
Genzer

Reputation: 2991

According to your project structure, the .css file and images folder is in the same level, So:

background: url(images/img02.jpg) no-repeat left top;

will work.

Upvotes: 2

Related Questions