How to make HTML read CSS in a Maven project

Question

I created a Maven Project in STS, with no archetype and having packaging as "war".

The project structure is as follow

portal
    ----Deployment Descriptor: portal
    ----JAX-WS Web Services
    ----Java Resources
        ----src
            ----main
                ----java
                ----resources
                    ----assets
                        ----login.css
                ----webapp
                    ----login.html
            ----test
                ----java
                ----resources
        ----Libraries
    ----Javascript Resources
    ----Deployed Resources
    ----target          
    ----pom.xml

I created login.html in src/main/webapp folder and created assets/login.css in src/main/resources.

My question is that when I try to include that css file in the html code, it is unable to read that.

What to do for that?

Also, after googling a bit, I came to know that for such situations, put the files in WEB-INF and it'll do all the rest. But while creating the project, WEB-INF folder was not created. Although I can create it myself, but just want to know where I am doing wrong in creating a maven project which should by default create WEB-INF folder.

What web server are you running ? The HTML doesn't read anything, it is only interpreted and the browser makes extra requests for any resource it requires. Have you checked browser console ? Does it throw any errors ? — Catalin, Apr 04 '17 at 12:11
You (for the basic use case) cannot put CSS files into WEB-INF, since anything that's in WEB-INF is not accessible directly through an URL. — Jiri Tousek, Apr 04 '17 at 12:13
When you build the `war`, in what path does the `css` file end up? I'd expect `resources` to be put into `web-inf`, while you want the css file to be in public part. `webapp` should be the right place in my understanding. — Jiri Tousek, Apr 04 '17 at 12:15
Okay, then either assets folder is not public (I can't tell for sure) or you're using the wrong path in your html. You could try moving your web resources in webapp and then see if it works. — Catalin, Apr 04 '17 at 12:24

score 3 · Accepted Answer · edited May 23 '17 at 12:32

From the information you provided, I can guess you created a new maven project as [x]Create a simple project (skip archetype selection). If you did create the project this way it will not create a WEB-INF folder by default.

If you do New->Maven Project->Next-> and select a maven-archetype-webapp by default you will end up with a WEB-INF folder. NOTICE: the "webapp" archetype.

And regarding where to put the .css files. Maven's Standard Directory Layout suggest src/main/webapp for Web application resources. This other Q&A has a good answer for where to .css files for web projects.

How to make HTML read CSS in a Maven project

1 Answers1