htmlcssjspweb-applicationsjspinclude

Webpage jsp:includes header but doesn't use linked stylesheet


I've got some problems with finding the right way to ask this question. But I hope you understand the problem and are able to help.

I've set up a really basic Maven Web-App, using jsp's.

At the moment I have 2 pages.

  1. Index.jsp (Starting page with loginbutton)
  2. Home.jsp (Home page after login)

I also have an header.jsp and a footer.jsp. Both the index.jsp and the home.jsp use the header and footer.

In the header is a link to a stylesheet. When I run the project. Both index.jsp and home.jsp use the header (they've got the right tag) But only index.jsp uses the stylesheet.

Why doesn't home.jsp use the stylesheet, even when the header is included correctly.

Here are some images of the code to help you understand the situation.

The Project Structure

The Project Structure

Index.jsp with the include of header/footer.jsp

Index.jsp with the include of header/footer.jsp

Home.jsp with the same include of header/footer.jsp, only the path is different. But they load correctly, except for the css.

Home.jsp with the same include of header/footer.jsp

And here is the Header.jsp, with the link to the stylesheet

the Header.jsp, with the link to the stylesheet

If you need more info, I'll be happy to give it.


Solution

  • Thanks to the Answer of @Rohit Gaikwad I was able to figure it out myself.

    Turns out that you need to locate the css from the used page (so not only from header.jsp but also from index/home.jsp

    So I changed the link to the stylesheet to the following:

        <link rel="stylesheet" type="text/css" href="css/default-header.css"/>
        <link rel="stylesheet" type="text/css" href="../../css/default-header.css"/>
    

    This way i can be used from the index.jsp and the home.jsp (still not sure why index.jsp can load the css from the css/default-header.css link, without browsing the folders using "../")