Trying to determine where/how to place style sheets in web app deployed to Tomcat 6 so that the styles.css can be resolved. I've tried every thing I can think of without success.
I did these tests to ferret out were to put the file but little has been successful.
1.) put css in-line with style attribute to verify text display green.
<div id="xxx" style="color:green;"> This worked.
Then I removed the attribute and
2.) moved it into a in-file <style></style> stmt in the jsp. This also worked.
I copied the css stmt into styles.css and disabled the in-line stmt in the jsp.
3.) added <link></link> stmts to file. I tried several path refs to the file.
And I put the file in several different directory locations to see where
it would get resolved. (none were found)
<link rel="stylesheet" type="text/css" href="styles.css">
<link rel="stylesheet" type="text/css" href="css/styles.css">
<link rel="stylesheet" type="text/css" href="/css/styles.css">
Using FireBug (css tab) I see the follow information for these links
* <link rel="stylesheet" type="text/css" href="styles.css">
this displays the src to index.html in the root dir
* <link rel="stylesheet" type="text/css" href="css/styles.css">
this displays the msg
Apache Tomcat/6.0.13 - Error report
HTTP Status 404
The requested resource () is not available.
* <link rel="stylesheet" type="text/css" href="/css/styles.css">
this displays
Failed to load source for: http://192.168.5.24:9191/css/clStyles.css
The contextPath is /microblog And basepath is http://192.168.5.24:9191/microblog
Here is the test code I am using.
I am using Spring 3. I have a simple JSP
-- test.jsp --
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
<head>
<base href="<%=basePath%>">
<link rel="stylesheet" type="text/css" href="styles.css">
<link rel="stylesheet" type="text/css" href="css/styles.css">
<link rel="stylesheet" type="text/css" href="/css/styles.css">
<style>
#Yxxx {color:green;}
</style>
</head>
<body>
<div id="xxx">
<h2>Test <%=path%> <%=basePath%></h2>
</div>
</body>
</html>
I've placed the styles.css file at many directory locations to see where it might get resolved but none appear to be found.
In Tomcat 6 the deployed exploded web app directory structure
webapps/microblog
webapps/microblog/styles.css
webapps/microblog/index.html
webapps/microblog/css/styles.css
webapps/microblog/WEB-INF/css/styles.css
webapps/microblog/WEB-INF/jsp/admintest/styles.css
webapps/microblog/WEB-INF/jsp/admintest/test.jsp
So how to get Tomcat 6 to resolve .css files?
Likely the relative CSS path is plain wrong. Make it domain-relative instead of path-relative. Prepend it with the context path (which is /microblog
in your case):
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/styles.css">
Note that resources in /WEB-INF
are not publicitly accessible. They're only accessible by RequestDispatcher
in servlets or by <jsp:include>
in JSPs. Put them outside /WEB-INF
.
If it still doesn't work, then likely a servlet or filter which is mapped on an URL pattern of /
or /*
is not doing its job properly.
Probably it's quite late but I managed to resolve this in a different way.
I have a simple html file inside my WebContent and a css folder:
this was not working:
<link rel="stylesheet" type="text/css" href="css/style.css">
and neither this:
<link rel="stylesheet" type="text/css" href="/css/styles.css">
this IS working, but it's ugly (and it's also giving me a warning in Eclipse):
<link rel="stylesheet" type="text/css" href="myproject/css/styles.css">
so I found that also this one is working, and seems the best approach to me:
<link rel="stylesheet" type="text/css" href="./css/styles.css">
none of the following will work deploying to http://192.168.5.24:9191/microblog
<link rel="stylesheet" type="text/css" href="styles.css">
This one points to http://192.168.5.24:9191/styles.css
<link rel="stylesheet" type="text/css" href="css/styles.css">
This one points to http://192.168.5.24:9191/css/styles.css
<link rel="stylesheet" type="text/css" href="/css/styles.css">
This one points to http://192.168.5.24:9191/css/styles.css
You need to prefix the context path :
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/styles.css">
or the full path :
<link rel="stylesheet" type="text/css" href="<%=basePath%>/styles.css">
The resources under /WEB-INF should be removed as they're not available for external requests
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With