2

I am working on designing a web application using Java servlets and JSP and am having issues getting the JSP file to include the CSS file. Each JSP page that is called up includes references to header and footer JSP files and the header file includes the with link to the CSS. All of these files are in a secure resource folder "proforma" within my web application. Prior to trying to include the CSS, the security and the header/footer inclusions were working fine, and continue to do so - they are just not formatted per the CSS.

I have the CSS reference included in a header file as follows:

header.jsp

<%@page language="java" contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" href="${pageContext.request.contextPath}/proforma/cssGuide.css" type="text/css"/>
        <title>Pro Forma</title>
    </head>
    <body>
        <h1><a href="/ProForma/proforma/controlCenter.jsp">Pro Forma</a></h1>

When I use the pageContext Expression Langugae (${}) like the above, the page content that is loaded is the actual CSS content itself, not the actual content I am looking for.

However, if I use the following JSP code, I get the correct HTML content and the browser source review shows the loaded correctly, but there is no CSS source code:

Alternative header.jsp file (ProForma is the name of the application):

<%@page language="java" contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" href="../ProForma/proforma/cssGuide.css" type="text/css"/>
        <title>Pro Forma</title>
    </head>
    <body>
        <h1><a href="/ProForma/proforma/controlCenter.jsp">Pro Forma</a></h1>

Here is a sample content page that I am trying to format:

<%@include file="../proforma/header.jsp" %>
<table>
    <tr>
        <td>
            ${createProjectResponse}
        </td>
    </tr>
    <tr>
        <td>
            <form action="/ProForma/downloadInput" method="post">
                <input type="submit" name="downloadInputButton" value="Download Input File" class="controlCenterButton"/>
            </form>
        </td>
    </tr>
    <tr>
        <td>
            <form action="/ProForma/AddProject" method="post">
                <input type="hidden" name="actionValue" value="addProject"/>
                <input type="submit" name="addPortfolioSubmit" value="Add Project" class="controlCenterButton"/>
            </form>
        </td>
    </tr>
    <tr>
        <td>
            <form action="/ProForma/SelectProjectController" method="post">
                <input type="hidden" name="actionValue" value="selectProject"/>
                <input type="submit" name="selectProjectSubmit" value="Select Project" class="controlCenterButton"/>
            </form>
        </td>
    </tr>
</table>
<%@include file="../proforma/footer.jsp" %>

Here is the CSS file (very simple at this point until I get it working):

input.controlCenterButton{
    width: 20em;
    height: 2em;
}

For what it is worth, here is the footer.jsp file:

        <p id="footer_p">Company</p>
    </body>
</html>

Is there something that I am missing that is preventing the CSS file from being included? I appreciate any help.

Declan
  • 448
  • 10
  • 27
  • can you inspect the final output? you can check the CSS file is loading.. – Kheema Pandey May 12 '15 at 17:39
  • Good question, I meant to include - using the above with the pagecontext EL, the CSS file contents themselves are loaded into the browser when the page is called. If I replace the EL with "../ProForma" (this is the application name), I get the correct page content and the HTML source code shows the CSS reference in the section but there is no CSS file loaded into the browser. – Declan May 12 '15 at 17:45
  • I made some slight edits to the above to show the different header file formats for referencing the CSS file. – Declan May 12 '15 at 17:49
  • you are using this path for CSS `../ProForma/proforma/cssGuide.css`. Is that right? I doubt something is wrong due to wrong path given... – Kheema Pandey May 12 '15 at 17:51
  • Yes, that is the path that I am typically using and it seems to be working fine (except that the CSS is not loading). I started using the EL b/c several sources I read seemed to suggest it, but it actually makes the problem worse - the CSS file content itself is loaded into the page rather than the HTML content I want. – Declan May 12 '15 at 17:53
  • Is there something that needs to be formatted in the web.xml file? – Declan May 12 '15 at 17:53
  • I wish I could help you. but I've no experience of Java language. – Kheema Pandey May 12 '15 at 17:55
  • what if you try this way `` – Kheema Pandey May 12 '15 at 17:59
  • @Delcan I got this SO link. http://stackoverflow.com/questions/3655316/browser-cant-access-find-relative-resources-like-css-images-and-links-when-cal – Kheema Pandey May 12 '15 at 18:01
  • @KheemaPandey using the – Declan May 12 '15 at 18:10

0 Answers0