I am writing a java servlet (struts/JSP etc). I am trying to style a progress bar using CSS in a JSP page but get this error when using chrome's developer tools:
Resource interpreted as image but transferred with MIME type text/plain.
<%@ include file="../include/css/default.css" %>
And in the CSS file:
background:url(../images/bg_bar.gif) no-repeat 0 0;
Could anyone explain why this is and show how I can use this CSS in my page?
My guess is that you get an error page instead of the image. Try typing full path to the image in your browser and see if it works. That is: http://domain/app/include/images/bg_bar.gif
If you get an error - then your problem is that your images are not accessible to the public.
Ahh... I got where is your problem. You are including the css with @include, so it inserts the whole css file into your html code.
The result will look like this:
localhost:8080/GraphBuilder/yourpage.htm
<html>
...
<style>
.myId {
background:url(../images/bg_bar.gif) no-repeat 0 0;
}
</style>
...
Now, looking at the address of the page, where do you think will it try to find the image? Exactly, in localhost:8080/GraphBuilder/../images/bg_bar.gif -> localhost:8080/images/bg_bar.gif.
You have 2 options to solve it:
<style type="text/css" src="include/css/default.css"/>. This will make it look for css in the path localhost:8080/GraphBuilder/include/css/default.css. And css will look for image in localhost:8080/GraphBuilder/include/css/../images/bg_bar.gif -> localhost:8080/GraphBuilder/include/css/images/bg_bar.gif.